如何在不包含内容的情况下保持内联框显示？

Question

我有一个SPAN内联框。即使我使用内联块或宽度来设置它，它也不会显示何时不包含任何内容。我必须添加一个非中断空间来显示它。

<span class='myClass'>&nbsp;</span>

Answer 1

  

我有一个SPAN内联框。甚至我   用直线块或宽度设计它，   当它包含否时它不会显示   内容。

Here is the working demo

使用的CSS：

  .myClass{
    display:inline-block;
    width:100px;
    height:100px;
    border:1px solid red;
  }

Answer 2

Span没有自己的任何格式，它只是告诉浏览器将样式规则应用于＆lt; span＆gt;内的任何内容，因此如果它是空的，则不会显示。使用＆lt; div＆gt;如果你想要一个永远显示的盒子容器。

Answer 3

尝试给它一个高度：http://jsfiddle.net/Fx8TB/

<p>asdf<span></span>adsf</p>
<p>asdf<span id=withHeight></span>adsf</p>

。

span
{
    width:100px;
    display:inline-block;
    background-color:red;
}

#withHeight
{
    height:10px;
}