css - 跨浏览器的无序列表

Question

我在格式化无序列表以在所有浏览器中正常工作时遇到了一些问题。下面在 Chrome 中看起来不错，但在 IE 和 Firefox 中很奇怪。

这很简单，我知道，但我是新手，似乎不太正确。

感谢您的帮助!

HTML:

<div id="leftcolumn">
<ul>
<li>Lorem Ipsum</li>
<br>
<li>Lorem Ipsum</li>
<br>
<li>Lorem Ipsum</li>
<br>
<li>Lorem Ipsum</li>
</ul>
</div>

<div id="rightcolumn">
<ul>
<li>Lorem Ipsum</li>
<br>
<li>Lorem Ipsum</li>
<br>
<li>Lorem Ipsum</li>
<br>
<li>Lorem Ipsum</li>
</ul>
</div>

这是 CSS:

#leftcolumn {
    float: left;
    width: 50%;
    }

#rightcolumn {
    float: right;
    width: 50%;
    }

Answer 1

考虑使用

ul li{
    padding-bottom:1em;
}

而不是 <br>