{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 劫难 的问题《CSS background and body height 100%》','https://www.manongdao.com/q-689863.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
I am having trouble getting my background image to span the entirety of my content.
I looked at other questions and it seems that I need to set a min-width of 100% on each container... but I tried every combination and it still wasn't working.
Here is my 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;
}
The problem I am having is that the postsArea content usually spans more than the browser's window, but the background does not.
Thanks
EDIT
Ok, so I narrowed it down to a reset.css file... Any tips on going about discovering the problem in that file?
Thanks.
Ok, so after looking at the reset stylesheet, I discovered this:
Commented this line out and everything seems to be fine :)
Thanks a lot for all the help