% 在 CSS 位置的某个时候不工作

Posted 2023-03-06

技术标签:

【中文标题】% 在 CSS 位置的某个时候不工作【英文标题】：% is not working sometime in position CSS 【发布时间】：2013-03-02 16:21:21 【问题描述】：

我正在将位置（以 % 为单位）应用于某些 div，但它不起作用。这是代码。

#transitions 
  position: absolute;
  top: 0;
  bottom: 70%;
  display: block;

但是当我申请时：

  #transitions 
    position: absolute;
    top: 0;
    bottom: 70em;
    display: block;

它对我有用。

b/w % 或 em 有什么不同吗？

请帮忙。

【问题讨论】：

可能重复：***.com/questions/132685/font-size-in-css-or-em 不过，你还是可以看看：kyleschaeffer.com/user-experience/… #transitions 容器的 css 是什么？ 【参考方案1】：

em 和 % 之间有很多区别。

% 表示元素容器的百分比大小。在以下示例中，<div> 将是页面宽度的 70%。

<body>
    <div>A div</div>
</body>

CSS

div  width: 70%;

em 表示基于当前font-size 的大写字母“M”的大小。改用以下 CSS，<div> 将是 70 个“M”字符的大小。

div  width: 70em;

您的示例会将#transitions 元素的左侧定位在其容器的70% 处。或距容器左侧 70 个“M”字符。

【讨论】：

【参考方案2】：

如果你想计算 % vs em，那么它很可能是 170% = 32px = 2 em 这样的字体大小，你可以计算它 1 em = 16px 和 100px = 531.25 %

【讨论】：

以上是关于% 在 CSS 位置的某个时候不工作的主要内容，如果未能解决你的问题，请参考以下文章