korat
Members
-
Joined
-
Last visited
-
The "if ie6" conditional worked great, thanks!
-
I'm trying to build a website for a newly formed charity. I'm no expert and would appreciate some help if anyone has any ideas. The page has a logo and banner image at the top. A nav bar across the bottom of those and a three columns layout beneath that. In Fifefox all is ok but in IE6 there is a 2-3px gap between the the banner image and the nav bar image below. Any ideas why and how to get rid of it? Below is the html and css and I've attached the images as well. thanks HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> <link rel="stylesheet" type="text/css" media="screen" href="default.css" /> </head> <body> <div id="wrap"> <div id="head"> <div id="banner"><img src="images/banner6.jpg" alt="uh" width="600" height="149" /> </div><!-- end banner --> </div><!-- end head --> <div id="navbar"> </div><!-- end navbar --> <div id="maincontent"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </div><!-- end maincontent --> <div id="rightcontent"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </div><!-- end rightcontent --> <div id="leftcontent"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </div><!-- end leftcontent --> </div><!-- end wrap --> </body> </html> CSS html { font-size:100.01%; padding:0; margin:0; height:100%; } body { margin:0; padding:0; font:.9em Verdana, Helvetica, Georgia, Sans-serif; background-color:#84a67a; } h1,h2,h3,h4,h5,h6 {margin:5px;font-family:"Courier New", Courier, monospace;} img {border:0;} p {text-align:justify;} #wrap { width:749px; color:#fff; margin:0 auto; } #head { height:149px; background:url("images/logo.gif") no-repeat; margin:0; padding:0; } #head #banner { float:right; } #navbar { height:50px; background:url("images/navbar.gif") repeat-x; margin:0; padding:0; } #maincontent { position:absolute; background-color:#ccc; left:338px; width:320px; } #leftcontent { text-align:center; background-color:#0000ff; padding:10px; width:170px; } #rightcontent { background-color:#0000ff; text-align:center; float:right; width:180px; padding:10px; }
