发现IE6、IE7下列表li中内联块级元素的错位bug
此篇记录发出前，记忆中没有看过相关bug的描述。开发中遇到，对此问题做了简单的代码还原：
<!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> new document </title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><meta name="author" content="tofishes@163.com" /><meta name="keywords" content="" /><meta name="description" content="" /><style type="text/css">ul { padding:0;margin:0; }li { padding:2px 0; }li li { padding:0; }a { display:inline-block; }</style> </head> <body><ul class="row"><li><ul><li>了款到即发</li><li>拉拉拉拉</li><li>拉拉拉拉</li></ul></li><li>正常的无display:inline-block;的情况<a href="">这个链接是display:inline-block;</a></li></ul> </body></html>
在ie6/7下 效果如下：
http://dl.iteye.com/upload/attachment/226519/303ae87e-0cc7-3d1f-b360-77ca4359cf4a.png
<li><ul><li>了款到即发</li><li>拉拉拉拉</li><li>拉拉拉拉</li></ul></li>
这行代码是关键，将ul换成div则不会错位，只有这个ul存在就会错位。
解决方法就是设置这个ul为display:inline; 或 inline-block;
页:
[1]