行级元素的宽度问题

有时候需要一个空白的Anchor标签，然后给它一个背景图，常用于一些小的功能按钮，但是无任何内容的标签又默认没有宽度，做了一个简单测试，结果如下：

FF3:

IE6(使用IE Tester):

IE7:

Safari4:

看来还是使用&-n-b-s-p-;的兼容性最好。

mt-inline-block的内容:

html>body .mt-inline-block{display:-moz-inline-box;display:inline-block;}
.mt-inline-block{position:relative;display:inline-block}
* html .mt-inline-block{display:inline}
*:first-child+html .mt-inline-block{display:inline}

 

从结果中还能看出外层容器和行框之前的间距不同的浏览器是不同的，IE6:0, IE7: 2px, 其它：1px，在某些情况下可能有问题，这里暂不讨论。