html - How to align the header menu from left? i see a unexpected margin on left. Help please -


http://cooking.comyr.com/

i creating header menu using css. can see on above url. html code

<!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=utf-8" /> <title>let's foodie | homemade restaurant style food</title> <link href="style/main_css.css" rel="stylesheet" type="text/css" /> </head> <div id="header">         <ul>               <li><a href="#" title="home"><span>home</span></a></li>               <li><a href="#" title="recipes"><span>recipes</span></a></li>               <li><a href="#" title="recipe finder"><span>recipe finder</span></a></li>               <li><a href="#" title="foodie blog"><span>foodie blog</span></a></li>               <li><a href="#" title="foodie forum"><span>foodie forum</span></a></li>               <li><a href="#" title="tips & tricks"><span>tips & tricks</span></a></li>         </ul> </div><!--header class ends here--> <body> </body> </html> 

my css is

#header {     float: left;     width: 900px;     /* font-size:93%;*/     line-height: 45px;     background-color: #f00; } #header ul {     width: 100%;     list-style: none;     background-color: #03c;     margin:auto; } #header li {       display:inline;       margin:0;       padding:0;       text-align:center;       font-family:jokerman;       font-size:18px       } #header {       float:left;       background:url("green.png") no-repeat left top;       margin:0;       width:150px;       text-decoration:none;  } #header span {       display:block;       background:url("green.png") no-repeat right top;       color:#f00;       float:none; }  #header a:hover span {       color:#fff;       background:url("orange.png") no-repeat right top; } #header a:hover {       background:url("orange.png") no-repeat right top; } 

how can rid of margin on left?

url see issue : http://cooking.comyr.com/

the body tag has default margin property. use following css code rid of default margin:

body {     margin:0; } 

Comments

Popular posts from this blog

java.util.scanner - How to read and add only numbers to array from a text file -

rewrite - Trouble with Wordpress multiple custom querystrings -