CSS下关于span的显示错误修正

  今天在浏览帖子时候，无意间看到一个css关于span的问题（当然是IE下的）

 

<div>
<span id="span1">操作1</span>
<span id="span2" style="display:none;">操作2</span>  
<span id="span3">操作3</span>  
<span id="span4">操作4</span>  
</div>

 

上述HTML在IE5,6,7下出现的结果是在操作1和操作3之间会有两个空格，而在firefox下却正常显示只有一个。

 

那如何使得IE下也正常显示一个空格呢。

网上给出了很多方法，我摘抄如下：

 

1.最常用的，最简单的

 

<div>
<span id="span1">操作1</span><span
 id="span2" style="display:none;">操作2</span>  
<span id="span3">操作3</span>  
<span id="span4">操作4</span>  
</div>

 看到区别了吗？就是将第二个的span在span处换行即可。

  或者都写在同一行中。

<div>
<span id="span1">操作1</span><span id="span2" style="display:none;">操作2</span><span id="span3">操作3</span><span id="span4">操作4</span>
</div>

 

2.设置CSS,改变定位方式

  

<div>
<span id="span1">操作1</span><span
 id="span2" style="display:none;float:left">操作2</span>  
<span id="span3">操作3</span>  
<span id="span4">操作4</span>  
</div>

 3.替换display:none,好处是在IE4下也能正常工作(虽然如今是没用了)

 

<div>
<span id="span1">操作1</span><span
 id="span2" style="position:absolute; width:0; height:0; overflow:hidden;">操作2</span>  
<span id="span3">操作3</span>  
<span id="span4">操作4</span>  
</div>