带位置的屏幕的CSS百分比：绝对

Question

我有一个“浮动”菜单类型的东西在配置文件的左侧显示一些信息，它看起来不错，但我之前使用了不同的电脑，它与主页主体重叠（由于屏幕分辨率）。

因此，这是原来的CSS（与CSS3花哨的东西剥离出来）：

position: absolute; 
border: 1px solid #73a7f0; 
width: 200px; 
left:10px; 
top: 160px; 
padding: 5px 14px; 
border-radius: 4px; 

，这就是我要做的，已更改的行是：

width: 10%; 

任何想法如何看起来相同取决于屏幕？

谢谢！

Answer 1

如果容器有静态定位，Diodeus的答案是正确的。如果容器的宽度设置为，甚至一个百分比宽度，并且容器的位置不是static（默认值），则该子将使用该位置作为百分比宽度的上下文。

这里的小提琴：http://jsfiddle.net/USJnN/

Answer 2

绝对定位的元素不再是布局的一部分。当为块元素指定宽度时，宽度为，相对于其容器。如果没有固定大小的容器，除了浏览器窗口（可变）之外，百分比并没有真正的大小上下文。

以像素为单位使用宽度是您在这种情况下需要的。