位置为的屏幕的CSS百分比:绝对值

CSS percentage of screen with position:absolute

本文关键字：绝对值 百分比 屏幕 位置 CSS      更新时间：2023-09-26

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

这就是最初的CSS（去掉了CSS3的花哨内容）：

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

这就是我要做的，改变的路线是：

width: 10%;

有什么想法可以让它在屏幕上看起来一样吗？

谢谢！

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

Fiddle here：http://jsfiddle.net/USJnN/

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

在这种情况下，您需要使用像素宽度。

相关文章：