2010-01-16 63 views
1

我正在設計在線簡歷的過程中,但我在谷歌瀏覽器中遇到了問題,而ie7中有一個無序列表。雖然它們在側欄中呈現良好,但由於內容部分中的某些原因,第一個項目符號點漂浮在其容器的最右側,文本顯示正常,並且所有其他項目符號點和文本都很好地定位。這個bug在任何其他主流瀏覽器中都不會發生。谷歌瀏覽器和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;} 

​​

古怪它工作在IE6和IE8,所以我搞糊塗了,因爲我已經沒有編碼不同於我通常會和側邊欄UL的使用相同的代碼,如圖渲染罰款。有誰知道這可能是什麼原因造成的?

回答

5

添加到您的樣式表:

ul { clear: left; } 

看來你的(我假設是p標籤)段有一個float: left並指定了一個明確的寬度。但是,ul仍然試圖將該段落保留在左側,併產生了奇怪的結果。

+0

不錯,歡呼爲捕捉=) – Qwibble 2010-01-16 20:47:50