css:如何从HTML删除"不可见空间"

换行符导致了它-http://jsfiddle.net/RhvjF/1/

找不到特定的帖子，但是聪明的人提出了3种解决方法：

将所有内容放在一行中（删除所有换行符）

注释掉换行符，例如

<span style="display: inline">Hello Wo</span><!--
--><span style="display: none;"></span><!--
--><span style="display: inline">rld</span>

设置容器 font-size 到 0 并重新设置为 span -s

UPDATE

至少还有2种方法：

破坏标签，例如

<span style="display: inline">Hello Wo</span
><span style="display: none;"></span
><span style="display: inline">rld</span>

浮动元素，即 span { float: left }

这是由换行引起的.您有两种选择：

删除换行符

浮动您的内容。

Option 1

<span style="display: inline">Hello Wo</span><span style="display: none;"></span><span style="display:inline">rld</span>​

Option 2

<style>
    #spanContainer > span { float:left; }​
</style>
<div id="spanContainer">
    <span style="display: inline">Hello Wo</span>
    <span style="display: none;"></span>
    <span style="display: inline">rld</span>​
</div>

请参阅http://jsfiddle.net/RhvjF/2/

HTML：

<div id="wrapper">
    <span style="display: inline">Hello Wo</span>
    <span style="display: none;"></span>
    <span style="display: inline">rld</span>
</div>

CSS：

#wrapper{
    font-size:0;
}
#wrapper>*{
    font-size:16px; /* Or whatever you want */
}