css - Absolute Positioned Div is hiding my other divs below -
have at, http://thomaspalumbo.com
i have css website's container:
.graybox { padding: 0 30px 30px 30px; background: #ededed; position:absolute; left:0; right:0; }
then have container on top of center info. .graybox
container spreads width of page want footer div hidden, according firebug behind? , on page?
is there fix this?
while i'm here can explain white space on right side of page. comes effect once page resized smaller.
you can use css z-index
property make sure footer in front of content. z-index works when element positioned though. make sure add position:relative
footer
#footer{ position:relative; z-index:999; }
read more: http://www.w3schools.com/cssref/pr_pos_z-index.asp
edit
just checked out code of website, , don't understand why graybox
positioned absolutely, make things more complex. same goes menu, why position absolute, why not add in right order in html in first place?
edit
if want center content background has 100% width can add container div so:
html
<div class="container"> <div>lorem ipsum....</div> </div>
css
.container{ background:red; } .container div{ width:400px; margin:0 auto; background:yellow; }
see jsfiddle here: http://jsfiddle.net/hxbnf/
currently cannot because have container set @ 980px
, don't ever unless sure don't want wrap on it, in case background of div in container.
Comments
Post a Comment