SitePoint Sponsor |
|
User Tag List
Results 1 to 3 of 3
Thread: Footer wiping out border
Hybrid View
-
Aug 25, 2004, 21:57 #1
- Join Date
- Aug 2004
- Location
- Australia
- Posts
- 44
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Footer wiping out border
I'm having a little trouble understanding why my site won't show my footer properly. I have read the FAQ regarding footers and I am testing my site on IE6 and Firefox 0.9.3.
Basically, I don't understand why my footer does not show a black border around it. I put a border on the footer as a bandaid as I could not get the footer to sit just inside the content box so that the bottom border of the content box would show. Can someone point me in the right direction so that I can get my footer working how I would like it too? I don't know that I'm understanding the calculating for top and bottom margins that well.
I have put my code below:
Code:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style type="text/css"> /* commented backslash hack v2 \*/ html, body{height:100%;} /* end hack */ body { padding: 0; margin: 0; text-align: center; /*Center the content div*/ height: 100%; } #content { margin: 10px auto; height:auto; width: 760px; min-height: 100%; /* for mozilla*/ text-align:left; /*so content isn't centered as body is*/ border: 1px solid #000; background: #FFF; margin-bottom:-50px; /*for footer*/ } * html #content{height:100%;} #footer { margin: 0 auto; /*auto margin required for left/right to center footer*/ width:760px; clear:both; height:50px; text-align:left; background-color: #FF8080; border: 1 px solid #000; } #clearfooter{clear:both;height:50px;} #gap{ margin: 0 auto; width:760px; height:10px; background:#fff; } div>p {margin:0} </style> </head> <body> <div id="content"> Content Here <div id="clearfooter"></div> </div> <div id="footer">Footer</div> <div id="gap"></div> </body> </html>
Brad.
-
Aug 25, 2004, 22:00 #2
- Join Date
- Aug 2004
- Location
- Australia
- Posts
- 44
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Sorry to reply to my own thread but I just figured out why my border wasn't showing on my footer.
I had:
border: 1 px solid #fff;
There shouldn't have been a space between the "1" and the "px".
Brad.
-
Aug 26, 2004, 04:33 #3
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Yes that's a common mistake
Bookmarks