既然FF和OPERA都基于上述原理来解释这种类似表格的样式,IE又不支持,何不为其设定一个相同的解释机制呢?我们先来看看IE下我们所能做作的:
<!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><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>Normal</title><style type="text/css"><!-- *{ margin:0px; padding:0px;}body{ text- align:center;}#d{ display:table; margin:0 auto; background:#0cf; padding:10px; width:799px; borde r:1px solid #f00;}#d ul{ display:table-row-group;}#d li { display:table-cell; list- style:none; _float:left; width:158px; border:1px solid #333; background:red; text-align:center;}-- ></style></head><body><div id="d"> <ul> <li>aaa</li> <li>aaa</li> <li>aaa</li> <li>aaa</li> <li style="width:157px">aaa</li> </ul></div></body></html>
这里定义了#d li向左浮动,也分别定义了它们的宽度(注:这里因为设定了其border为1px,宽度就是158px了)。为了防止FF/OPERA识别浮动,用了_float:left;
OK——这回可以在IE下测试了——相当完美!当然FF/OPERA下当然也一样到此,如果你认为问题解决了,并且你平时也是这么做的——那么你现在可以关闭这个话题了,该忙什么就忙什么吧!