1

我正在设计在线简历，但在 google chrome 和 ie7 中遇到了无序列表的问题。虽然它们在侧边栏中呈现良好，但由于某种原因在内容部分中，第一个项目符号点浮动到其容器的最右侧，文本显示良好，所有其他项目符号点和文本自身定位良好。此错误不会在任何其他主要浏览器中发生。

这是代码，以及正在发生的事情的屏幕截图。

<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;}

IE7 和 Google Chrome 中的错误图像

奇怪的是它在 IE6 和 IE8 中工作，所以我很困惑，因为我的编码与我通常不会不同，并且侧边栏 ul 使用与所示相同的代码渲染得很好。有谁知道这可能是什么原因造成的？

4

1 回答 1

5

将此添加到您的样式表中：

ul { clear: left; }

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

于 2010-01-16T20:37:20.370 回答