2011-07-03 91 views
2

我无法让我的背景图像跨越整个内容。CSS背景和身高100%

我看了其他问题,似乎我需要在每个容器上设置100%的最小宽度......但我尝试了所有组合,但仍然无法正常工作。

这里是我的HTML:

<body> 
<div id="container"> 

    <div id="header"> 
       header content...    
    </div> 
    <div id="content"> 

     <div id="myAccountArea" class="section"> 
      accountArea content... 
     </div> 

     <div id="myPostsArea" class="section"> 
     postsArea content... 
     </div> 

    </div> 
    <div id="footer"> 
    </div> 
</div> 

CSS:

html, body { 
    margin: 0; 
    padding: 0; 
    height:100% 
} 

body { 
    background: red; 
} 

#container { 
    padding-top: 80px; 
    margin-left: auto; 
    margin-right: auto; 
    width: 1000px; 
    min-width: 1000px; 
} 

#content { 
    min-width:1000px; 
} 

我遇到的问题是,postsArea内容通常跨越不是浏览器的窗口比较多,但背景才不是。

感谢


编辑

好了,我把范围缩小到一个reset.css文件...要去关于在该文件中发现的问题有什么建议?

谢谢。

+0

您是否遇到问题可见的地方?我感觉这可能是浮动div的问题,但除非我们能看到实际的页面,否则很难说。 –

+0

我认为你要搜索的是[overflow fix](http://css-tricks.com/795-all-about-floats/)或[sticky footer](http://www.cssstickyfooter.com/ )。我对吗? –

+0

这里没有足够的信息来*明确*回答你的问题。我*可以猜测,但这对我们两个人来说似乎有点反作用。或者提供一个到实时页面的链接,或者[jsFiddle](http://jsfiddle.net/)/ [JS Bin](http://jsbin.com/)演示。 – thirtydot

回答

5

好了,看着复位后的样式表,我发现了这一点:

html { 
    background:#FFF 
} 

评论这一行了,一切似乎要被罚款:)

非常感谢所有帮助

+2

什么样的愚蠢的重置包含它? – thirtydot

+0

雅虎的3.3.0版本... – AlexBrand