谷歌浏览器和IE7无序列表问题

Question

我正在设计在线简历的过程中，但我在谷歌浏览器中遇到了问题，而ie7中有一个无序列表。虽然它们在侧栏中呈现良好，但由于内容部分中的某些原因，第一个项目符号点漂浮在其容器的最右侧，文本显示正常，并且所有其他项目符号点和文本都很好地定位。这个bug在任何其他主流浏览器中都不会发生。

这里是代码和屏幕快照。

<h2>Education</h2> 
<div class="education"> 
    <h3>Institution Name</h3> 
    <p class="date">Date 1000<br />~ Date 2000</p> 
    <p class="description">Vel augue ac a adipiscing? Facilisis. Dictumst vut rhoncus ut scelerisque, duis mid! Amet ultricies parturient cursus amet? Cum, diam sed platea ultrices in, phasellus augue amet.</p> 
    <ul> 
     <li><span>Masters of Design</span></li> 
     <li><span>fagjfjfhdgsdf</span></li> 
     <li><span>Random blabble text</span></li> 
    </ul> 
    </div> 

.education ul{margin-left:120px;} 
#sidebar{} 
.education ul li, 
#sidebar ul li{list-style:square; font-size:18px; line-height:18px;} 
.education ul li span, 
#sidebar ul li span{font-size:13px; color:#3C3225;} 
ul{color:#11c9c7;} 

​​

古怪它工作在IE6和IE8，所以我搞糊涂了，因为我已经没有编码不同于我通常会和侧边栏UL的使用相同的代码，如图渲染罚款。有谁知道这可能是什么原因造成的？

Answer 1

添加到您的样式表：

ul { clear: left; } 

看来你的（我假设是p标签）段有一个float: left并指定了一个明确的宽度。但是，ul仍然试图将该段落保留在左侧，并产生了奇怪的结果。