2010年3月5日 星期五

CSS-IE6/IE7 BUG, OL, UL無法出現數字序列的問題

解決 ie6/ie7 ol, ul選單列前面無法出現數字的問題。

請用margin-left:20px;解決。
或者改用list-type:disc inside;

當你設list-style-position:ouside時,則要用margin-left:20px;
給它一點空間,因為在ie6/ie7裡list-style-position:outside; 是真的在可見範圍外,
這跟ie6/獨特的box模式有關。記得請用margin而非padding 喔。

注意:如果li, 有overflow:hidden的屬性,那即使
使用margin-left:20px 的解法或者將位置設為裡面,(list-style-position:inside;)。
只會讓ol, ul序列在ie7重複出現同一編號的序列符號。
所以要記得將overflow:hidden拿掉。

正確:
1.aaaaa
2.aaaaa
3.aaaaa
4.aaaaa


注意當li有overflow:hidden;的css屬性,
即使使用上述解法就會出現下方情況
1. AAAAA
1. AAAAA
1. AAAAA
1. AAAAA

所以最標準且保險的解法還是
ul li{
margin-left:
list-type:decimal outside;
overflow:hidden;
}

要特別注意這裡有沒有overflow:hidden這個問題喔。

沒有留言: