CSS列顯示不正確在IE9和IE8

Question

有誰知道如何使CSS3列在IE8和9的工作？而不是三列出現，只有一個列表。任何幫助，非常感謝！

Answer 1

Internet Explorer 8和9不支持CSS列。這並不是until version 10，微軟首先在瀏覽器中添加了這種缺少前綴的支持。因此，您無法在以前版本的Internet Explorer中獲得原生CSS Column支持。

您可能會遇到的最佳解決方案是有條件地加載a plugin，它可以在傳統瀏覽器中爲您實現類似的功能。考慮以下內容：

<style> 
    #columns { 
     -webkit-column-width: 200px; 
     -moz-column-width: 200px; 
     column-width: 200px; 
    } 
</style> 
<!--[if lte IE 9 ]> 
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.js"></script> 
<script> 
    $(function() { 
     $('#columns').columnize({ width: 200 }); 
    }); 
</script> 
<![endif]--> 

在這種情況下，Internet Explorer 10+和其他現代瀏覽器將使用CSS方法。 Internet Explorer 9及以下版本將使用jQuery替代方案。

請務必使用jQuery的1.x分支，因爲2.x分支不支持舊版本的IE。