背景图像左边缘问题

我有一系列背景图像需要淡入和出现在背景中。此背景图片出现在我的内容后面，居中，比我的内容更宽。我不希望这个图像影响我的页面的宽度，因此在容器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

背景图像左边缘问题

回答

相关问题