問題:在這里“快樂成長”欄目中的圖片css應該怎么寫?一開始寫好了,但加文章的時候就亂了。
解決:看您網站的源代碼:
<ul><li><div class="pe_u_thumb"><a href="/Item/1717.aspx"><img class="pic2" src="/UploadFiles/KLCZ/2008/4/200804191232104419.jpg" border="0" /></a></div><div class="pe_u_thumb_title"><a href="/Item/1717.aspx">彭妍妍:</a></div><div class="pe_u_thumb_title_2" /></li>
<li><div class="pe_u_thumb"><a href="/Item/1716.aspx"><img class="pic2" src="/UploadFiles/KLCZ/2008/4/200804191232104419.jpg" border="0" /></a></div><div class="pe_u_thumb_title"><a href="/Item/1716.aspx">彭妍妍:</a></div><div class="pe_u_thumb_title_2" /></li>
……
您這里是利用li的寬度控制來實現圖片左右排列循環的,但是,li在高度上有差異時,就會出現上述圖片中錯位的現象(如您現在的標題中的文字“彭妍妍:”與“11111111”的高度在瀏覽器中解析就會有差異)。
因此,解決您的問題很簡單,只要使瀏覽器讓循環的li解析出相同的高度即可。您可以用下面的方法解決您的問題:
1、可以定義控制標題的CSS“pe_u_thumb_title”有相同的高度。
2、可以定義li有相同的高度。
如:
.pe_u_thumb_title{
height: auto !important;
height: 24px;
min-height: 24px;
}
新聞熱點
疑難解答