dispay:none 属性在IE6, 7,8 使用中的小缺陷

最简单的方法是这么写

<span id="span1">操作1</span><span
id="span2">操作2</span>

以前myeclipse的代码format就是这么做的
在<span后面换行

当然不是所有的都要这么写，大部分span都不要做效果变化的

如果是作为代码生成用途，比如用taglib连续生成多个tag，我很赞同用这种方式，但如果是手写，这么做的坏处不比好处少

坏处在哪里？因为你没这么写过，而且不是所有的<span>或者<div>都需要这么写，只要那些需要做效果变化的部分，总比margin这些尾巴要舒服的多

而且也兼顾了换行，不至于代码所有的在同一行。

对比所有楼上给出的解决方案，个人认为这是最方便的一种。而且这个问题在web开发中间已经是老问题了，否则，myeclipse也不会采用这种format的形式

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

position:absolute也可以。

其实可以用“position:absolute; width:0; height:0; overflow:hidden;” 来替代 display:none ，好处是在IE4下面也能work（当然这没啥实际用处）。

呵呵，我是这么写过的，结果，后来这个代码，由于我忘了写注释提醒，结果被一个有洁癖的后来者给format了一下，于是问题又重现了，当然你可以说我没写注释，或者说后来者手痒欠扁，但是，这种写法的随意性过大也是一个事实。
当然，个人观点，看过就好

<style type="text/css">
ul#op li {display:inline;}
</style>
<ul class="op">
    <li></li>
    <li style="display:none;"></li>
    <li></li>
</ul>

必须用span的话，用style="display:none;position:absolute;"和style="display:inline;position:static;"转换也不错。

我觉得最实际和根本的解决方法就是把代码连起来。

我的做法是。定义两个class.
.ui-hidden{
display: none;
}
.ui-remove{
position: absolute; left: -99999999px;
}

遇到这种情况 使用 第二种方式。。

我这里有一个提议，没有经过测试，那就是
采用unix风格的文档换行
pc 风格换行是\r\n
unix风格是 \n
楼主用编辑器转换一下看看能不能解决问题