如何解决这个简单的IE渲染问题？

问题描述

| 考虑以下代码：

<style type=\"text/css\">

ul { clear: both; overflow: hidden; border: 3px solid red; margin-bottom: 10px; }
ul li { display: block; padding: 30px 80px; border: 1px solid green; float: left; }

</style>

<ul>

<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>

</ul>

<ul>

<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>

</ul>

在firefox和chrome（可能还包括野生动物园和歌剧，还没有测试）中，它看起来不错。表示

<li>\'s

在

<ul>\'s

绿色边框内。 但是在ie（9、8和7）中却不是这样。有没有办法像其他浏览器一样使ul包含lis？     

解决方法

        只需让IE通过向HTML添加doctype声明，以标准模式呈现文档即可。 原因是只有在IE的怪癖模式下，我才能想象您的

ul

不包含

li

。在标准模式下，它应呈现与其他浏览器相同的方式，此jsFiddle演示（在IE中查看）证明了这一点，该演示确保在其预览窗格中使用标准模式。