Mon, 2009-07-20 21:58
For some reason I can not figure out how to get my menu bar to 100% so any help would be great... And if this post is in the wrong place just let me know.
HTML
<html> <head> <title>M-C Design & Graphics</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <div id="container"> <div id="header"> <h2><a href="index.html"><img src="C:\Documents and Settings\Chris\Desktop\images\header1.png" alt="" /></a></h2> </div> <div id="menu"> <ul> <li id="active"><a href="index.html" id="current">Home</a></li> <li><a href="services.html">Services</a></li> <li><a href="templates.html">Templates</a></li> <li><a href="portfolio.html">Portfolio</a></li> <li><a href="testimonials.html">Testimonials</a></li> <li><a href="about.html">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </div> <div id="content"></div> <div id="footer">Copyright 2009 <a href="mailto:[email protected]">M|C Design & Graphics</a>, All Rights Reserved. </div> </body> </html>
CSS
*{ margin: 0px; padding: 0px; } body{ margin: 0px; padding: 0px; } /* -------------------------------------------------End Header------------------------------------------ */ #container{ position: relative; min-height: 100%; } /* --------------------------------------------------End Header----------------------------------------- */ #header{ list-style: none; text-decoration: none; border-bottom: 1px solid #000000; } /* --------------------------------------------------End Header----------------------------------------- */ #menu{ width: 100%; height: 20px; background-color: #256ba7; } #menu ul{ margin: 0px; padding: 0px; } #menu ul li{ display: inline; height: 20px; float: left; list-style: none; margin-left: 5px; } #menu li a{color:black; text-decoration:none;} #menu li a:hover{color:black; text-decoration:none;} /* --------------------------------------------------End Header----------------------------------------- */ #content{ } /* ---------------------------------------------------End Header---------------------------------------- */ #footer{ position: absolute; bottom: 0px; width: 100%; height: 16px; text-align: center; }