IE6中设定了position: relative; float: left的容器下，如果存在着多个带有背景的列表，那么这些列表中有一部分会显示不正常，具体的表现为背景消失。例如下面的代码（请在IE6中查看）：
| 以下是代码片段： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>TEST</title> </head> <style type="text/css"> #container { position: relative; float: left; } #container li { background: red; } </style> <body> <div id="container"> <ul> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> </ul> <ul> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> </ul> <ul> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> <li>Hello Kitty</li> </ul> </div> </body> </html> |
解决的方法是给li也加上position: relative。这个BUG的具体描述，请参考：http://www.positioniseverything.net/explorer/ie-listbug.html