背景圖像左邊緣問題

我有一系列背景圖像需要淡入和出現在背景中。此背景圖片出現在我的內容後面，居中，比我的內容更寬。我不希望這個圖像影響我的頁面的寬度，因此在容器div，ul或li元素上沒有設置寬度。我需要確定爲什麼在我的背景圖像上出現白色的左邊距。無論瀏覽器窗口的寬度如何，我的「測試」裏都會顯示此邊距。問題出現在瀏覽器中（測試：FF，Safari，Chrome，IE8），並且與用於旋轉和淡入淡出的JavaScript無關。背景圖像左邊緣問題

我敢肯定，這是死我簡直是俯視的東西。許多人都感謝任何能夠指引我在正確方向的人。

Link to an screenshot showing the problem.

Live example of the problem.

這樣做的HTML是：

<div id="hdrHomeWrap"> 
<ul id="hdrHome"> 
    <li class="hdrHome1"></li> 
    <li class="hdrHome2"></li> 
    <li class="test"></li> 
</ul>

CSS：

#hdrHomeWrap { 
margin: 0 auto; 
position:relative; 
top:-20px; 
} 
#hdrHome #hdrHome li { 
margin:0;padding:0; 
position:relative; 
list-style:none; 
} 
#hdrHome li { 
    display: block; 
    height: 400px; 
    display:none; /* hide the items at first only */ 
    list-style:none; 
    } 
    #hdrHome li.hdrHome1 { 
    background: url('images/hdr-home1.jpg') no-repeat top center; 
    } 
    #hdrHome li.hdrHome2 { 
    background: url('images/hdr-home2.jpg') no-repeat top center; 
    } 
    #hdrHome li.hdrHome3 { 
    background: url('images/hdr-home3.jpg') no-repeat top center; 
    } 
    #hdrHome li.test { 
    background: #F00; 
    }

來源

2011-04-27 Sara

有你嘗試給ul（#hdrHome）一個保證金&填充0？

在你的CSS，你有 #hdrHome #hdrHome li

我猜這是一個錯誤。你要麼在兩者之間缺少一個「逗號」。

所以它應該像#hdrHome, #hdrHome li而不是其他

來源

2011-04-27 16:17:40 rmlumley

謝謝rmlumley！當我們面對着我們時，我們無視它，這真是太神奇了。沿線的某處，我失去了這兩個ID之間的「，」。 – Sara 2011-04-27 16:20:58

我們都去過那裏。通常我們只需要另外一組眼睛來查看我們的代碼。不要忘記選擇一個答案，這樣可以關閉問題。 – rmlumley 2011-04-27 16:25:29

背景圖像左邊緣問題

回答

相關問題