在可变高度元素上保持完美的圆角

Question

我有一个完美圆角的按钮;含义，按钮是50像素高和圆角半径为25像素，使得按钮两侧的完美半圈：

用CSS实现，这是很容易，只要你已经知道的高度按钮（按钮高度÷2 =边框半径）。

但有可能保持完美的圆形边缘，如果按钮的高度动态地增加（更多的文本添加，例如）？：

Answer 1

只需设置border-radius的东西高，像360px。

div { 
    height:50px; 
    width:500px; 
    background:red; 
    border-radius:360px; 
} 

看看this jsFiddle example看看我的意思。