Trying to create a content box that has a background color of white. It is inbetween the header div and footer div which are both images. I can't get it to align with the two divs AND have it without white space, only one or the other.
This is the CSS:
#content {
background-color:#ffffff;
width:1024px;
margin: 0 auto;
font-family:Verdana, Geneva, sans-serif;
font-size:12px;
padding: 0;
display: inline-block;
}
How do I get the content box to align with the rest of the page and not have any whitespaces?
This is what it looks like at the moment, I want to get rid of the space between the HELLO box and the images above and below it.
It doesn't seem as a clean solution to me, but here I go:
#content {
margin-top: -15px; margin-bottom: -15px;
}
Actually I don't know if -15px is good enough, you should try your own values.
It's not a great solution, but with the given information it's the only one i can come up with.
CSS
#content {
background-color:#ffffff;
width:1024px;
margin: 0 auto;
font-family:Verdana, Geneva, sans-serif;
font-size:12px;
padding: 0;
display: inline-block;
position:relative;
}
#topWhiteFix, #botWhiteFix {
position:absolute;
left:0px;
height:12px;
width:100%;
background:#FFFFFF;
}
#topWhiteFix {
top:-12px;
}
#botWhiteFix {
bottom:-12px;
}
HTML
<div id="content">
<div id="topWhiteFix"></div>
<div id="botWhiteFix"></div>
HELLO
</div>
(Untested)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.