没有内容的CSS - div不会获得百分比宽度

Question

正如您在此处所见http://jsfiddle.net/2Qu9r/

如果没有内容的div将不会获得20% width，而如果我将一些内容放入其中则获得宽度

怎么了？

Answer 1

它就在那里，它没有height。

.dd高度为10px，您会看到它会显示出来。

例如

.dd {
  width:20%;
  height:10px;
  background:red;
}

<强> Fiddle

如果您在浏览器控制台中查看该元素，您会看到它将是：

120px x 0

这意味着120px宽，0高。

 是一个空白角色，但仍然是一个角色。显然，它有一个高度。这意味着120px x 0现在是120px x 20px。这就是为什么它可见，其中包含一个“空白”字符，但在没有内容的情况下不可见。

（120px＆amp; 20px只是示例测量值）