html和css基礎超過範圍的變成省略號

這事還得從瀏覽器的兼容性來說，我寫的網頁文件在chrome下面顯示正常，但是在ie9.0下顯示不正常，症狀就是不能正常變成省略號。這可如何是好，ie6.0本來就夠鬧心的了，這個iE9.0也不讓人省心，該咋辦呢。看我的代碼吧。

ie9.0下顯示：

 

控制代碼是：

css： .cbox ul li a{ text-decoration:none;!important; color:#333; float:left; width:210px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; border-bottom:#999 dotted thin; } 

html： <ul> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span>海青科技在做學校網站海青科技在做學校網站</a></li> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span>海青科技在做學校網站海青科技在做學校網站</a></li> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span>海青科技</a></li> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span>海青科技在做學校網站海青科技在做學校網站</a></li> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span>海青科技在做學校網站海青科技在做學校網站</a></li> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span>海青科技在做學校網站海青科技在做學校網站</a></li> </ul>
                        

 

更改之後：

css： .ellipsis{ white-space:nowrap; text-overflow:ellipsis; overflow:hidden; width:140px; display:block; } html>body .ellipsis { clear:none; } html>body .ellipsis:after { content: "..."; } html>body .ellipsis{ max-width:140px; width:auto !important; float:left; } ul{list-style:none;} 

html： <ul> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span><span class="ellipsis">海青科技在做學校網站海青科技在做學校網站</span></a></li> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span><span class="ellipsis">海青科技在做學校網站海青科技在做學校網站</span></a></li> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span><span class="ellipsis">海青科技在做學校網站海青科技在做學校網站</span></a></li> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span><span class="ellipsis">海青科技在做學校網站海青科技在做學校網站</span></a></li> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span><span class="ellipsis">海青科技在做學校網站海青科技在做學校網站</span></a></li> <li><a href="#" mce_href="#"><span style="float:right;" mce_style="float:right;">2011-5-8</span><span class="ellipsis">海青科技在做學校網站海青科技在做學校網站</span></a></li> </ul>  

• 
                         

  

 

。