text-indent一般用來實現(xiàn)文字縮進，不過更多的時候是用來實現(xiàn)文字隱藏。發(fā)現(xiàn)在IE6/IE7中，text-indent會導致inline- block元素出現(xiàn)向左(text-indent的值為負時)或向右(text-indent值為正時)的偏移。

inline-block元素設置text-indent在IE6/IE7中不正常，在IE8中正常。造成這種情況的原因應該是IE6/IE7并沒有真正實現(xiàn)inline-block， 而是通過設置display:inline-block觸發(fā)了IE的layout， 從而使內聯(lián)元素擁有了inline-block屬性的表癥。

解決方法：

.element{display:inline-block !important; display:block;}

因為ie6/ie7不支持 important 屬性，所以在 ie6/ie7 下元素會顯示為一個 block 級元素，而在支持 important 的瀏覽器（firefox, safari）下元素將顯示為一個 inline-block 級元素。

以上引用的“ie6/ie7不支持 important 屬性”那段純屬胡扯，IE6/7都支持important屬性的，只是在IE6中有一點點小bug，就是如上面的寫法確實是無效的，后面的屬性會覆蓋前面的（即使前面的有important屬性），但如果分成兩段寫就可以完美支持了，如下：

.element{display:block !important; display:block;}.element{display:inline;}

這樣的寫法（不管順序前后）IE6表現(xiàn)就和其他瀏覽器一致了！

關于實現(xiàn)ie6/7的inline-block屬性的方法如下：

.element{display:inline-block; *display:inline;zoom:1}

這樣通過zoom觸發(fā)IE的layout，就讓內聯(lián)元素擁有的inline-block屬性的特性！

關于在IE6/IE7中，text-indent會導致inline- block元素出現(xiàn)向左(text-indent的值為負時)或向右(text-indent值為正時)的偏移甚至消失的問題，下面做一個小結：

這里再考慮一個問題，使用text-indent的原因——比如：做一個按鈕時，由于按鈕的文字的藝術感太強直接跟背景一起切片，但處于SEO方面的考慮，要在a標簽內添加相應的文字，然后使文字不可見。于是最常用的方法text-indent:-9999px;（通常用在div、p之類的塊級標簽text-indent:2em;）但卻在按鈕設置上IE6、IE7下出現(xiàn)了問題，下面是解決辦法列表：

添加display:block;屬性

添加float:left|right;屬性

設置*text-indent:0;*line-height:300px;注意此方法要有寬高設置overflow:hidden;

去除text-indent屬性，設置font-size:0; line-height:0;

或者修改你的html，如：

? Download PDF

以上方法算是比較全的解決方案了，我最喜歡font-size:0;?line-height:0;這種啦！強烈推薦！