如何给空元素一些宽度和高度？

Question

我的页面上有一个空元素，我想给它一些宽度和高度。

这是一个jsfiddle来说明：http://jsfiddle.net/tzxv5zb3/

正如您将看到的，我尝试为元素提供一个样式属性，其中包含一些宽度和高度值。例如：

<span id="element-b" style="width: 100px; height: 20px; background-color: #555;"> </span>

然而，这没有任何作用。

如何为空元素（#element-b）提供一些宽度和高度？

Answer 1

默认情况下，

跨度是内联元素，这使您无法操纵其尺寸。 请尝试以下方法：

<span id="element-b" style="display: inline-block; width: 100px; height: 20px; background-color: #555;"></span>

Answer 2

span是一个内联元素。尝试使用div，否则添加

display:block;

到你的风格

your fiddle

中的示例

Answer 3

简单回答：应用＆＃34;`display：inline-block;＆＃34;风格到跨度。

对于旧版本的IE，您需要应用＆＃34; zoom: 1;＆＃34;内联块属性的INSTEAD。我很遗憾地说，我不记得你需要做的最高版本是什么，但我知道你需要它7。

Answer 4

这是因为span是内联元素。要使其符合宽度/高度规则，您需要将其设为block或inline-block。

请参阅：http://jsfiddle.net/tzxv5zb3/1/