2007-05-30

[Note] CSS Settings of HTML List

List的左邊預設有50px留給marker,但CSS未規範該空間應為margin(IE)或padding(FireFox),可以從設定背景色看出來。
將margin設為0,IE的marker就不見了,但將padding設為0,FireFox的marker卻跑到border外面去了。
所以為跨瀏覽器設定,兩個都要設,通常是將padding設為0,以margin做設定,不可以反過來,因為margin為0會讓IE的marker不見。

List的margin與padding設在ul或ol上,非li上。
#content ul {
margin: 20px;
padding: 0;
}

將li的display設為inline,可以讓List變成水平方向顯示,同時marker也自動消失。
#content li {
display: inline;
}

沒有留言:

張貼留言