Forum Moderators: not2easy
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><style type="text/css">
body{
margin: 0;
padding: 0;
}
#header{
float: left;
width: 800px;
height: 77px;
background-image: url(img/header.gif);
background-repeat: no-repeat;
background-position: center top;
border: 1px dotted #000
}
#navmenu {
background-image: url(img/navmenu.gif);
background-repeat: no-repeat;
background-position: center 1px;
width: 800px;
height: 36px;
top: 63px;
position: relative;
border: 1px solid #ccc
}
#navmenu ul {margin: -2; padding: 0;
list-style-type: none; list-style-image: none;
}
#navmenu li {
display: inline;
position: relative;
left: 107px;
padding: 0 10px 0 0;
border: 1px solid #ccc
}
#navmenu a {text-decoration:none; color: blue;
}
#navmenu img { border: none;
}
</style>
</head>
<body>
<div id="header">
<div id="navmenu">
<a href="<? get_bloginfo('url'); ?>" id="home"></a>
<ul>
<li><a href="<?php bloginfo('url'); ?>"><img src="./img/about.jpg'; ?>" alt="about" width="55px" height="26px" /></a></li>
<li><a href="<?php bloginfo('url'); ?>"><img src="./img/photos.jpg'; ?>" alt="photos" width="64px" height="26px" /></a></li>
<li><a href="<?php bloginfo('url'); ?>"><img src="./img/music.jpg'; ?>" alt="music" width="57px" height="26px" /></a></li>
<li><a href="<?php bloginfo('url'); ?>"><img src="./img/vocal.jpg'; ?>" alt="vocal tutorial" width="116px" height="26px" /></a></li>
</ul>
</div>
</div>
As you can see there's some images there that won't be showing if you test this out, however, the alt text shows the issue pretty well. It appears that IE is adding about 30 pixels or so to the left side of my navmenu list. (This is most easily seen if you delete the left:107px from the #navmenu li entry) I can't for the life of me figure out why.
I appreciate any help, and forgive me if I missed any of the posting steps,I tried hard to stay within the rules.
#navmenu img { border:none; float:left; padding-left:0px; }
May be it's helpful, if not try something alike.
Thanks enigma!
