[Solved] Position of navbar off by 10px in various browsers

I'd appreciate it if someone could enlighten me about why this navbar is about 10px off in IE 7 and Safari 3.1.1. It aligns correctly in FF 2.0.0.14 and Opera 9.27. I'm new to css and have researched inheritance issues and possible browser bugs and can't find anything about this issue. I've tried absolute positioning too. I'm working on this locally so I've removed the images from the code and left the shell. I'd appreciate any help. The name of the element is #navbar1 Thanks in advance.





XHTML Template

#home {
background:#fff url();
background-attachment:fixed;
font-family:"courier new", georgia, serif;
font-size:1em;
margin:0;
padding:0;
border:0;
color:#022c21;
}
h1 {
font-size:1.5em;
font-weight:bold
}
a {
color:#043059;
}
a:visited, a:hover {
color:#043059;
}
#container {
position:relative;
width:750px;
padding-top:250px;
margin-left:auto;
margin-right:auto;
}
#pageheader {
position:relative;
background:transparent url() no-repeat;
height:202px;
margin-left:-25px;
width:800px;
border:1px solid red;
}
#pageheader h1 {
visibility:hidden;
}
#intro h2 {
display:none;
}
/******Notes to self**positioning here is important given that it is a container for about and services*/
/* absolute positioning works with both IE and Firefox test more******/
/*also notice the background of the services div has two different shades. This is an issue with the background img*/
#intro {
position:relative;
background:transparent url() no-repeat;
margin:0 0 0 65px;
width:450px;
border:5px groove #41646c;
}
#about {
width:440px;
border:5px groove #41646c;
}
#about h1 {
margin:15px 0 10px 25px;
width:300px;
font-size:1.0em;
font-weight:bold;
text-align:left;
color:#000;
border-bottom:1px dotted #000094;
}
/*this styles the about paragraph on the home page*/
#about .cssabout {
width:350px;
padding:0 25px 15px 25px;
font-size:0.8em;
text-align:left;
color:#000;
}
/*this styles the about paragraph on the about page*/
#about .idabout {
margin:110px 0 5px 0;
width:440px;
padding:5px 25px 5px 25px;
font-size:0.75em;
text-align:left;
color:#000;
}
#about ul {
margin:10px 0 10px 35px;
padding:0;
}
#about li {
width:300px;
line-height:20px;
font-size:0.7em;
color:#000;
}
#services{
background:transparent url() no-repeat;
width:440px;
color:#000;
border:5px groove #41646c;
}
#services h1 {
width:250px;
margin-left:25px;
font-size:1.0em;
font-weight:bold;
text-align:left;
color:#000;
border-bottom:1px dotted #000094
}
#services .dservice {
padding:3px 25px 0 25px;
font-size:0.75em;
text-align:left;
color:#000;
}
#services ul {
margin:5px 0 0 35px;
padding:0;
}
#services li {
line-height:20px;
width:225px;
font-weight:bold;
font-size:0.7em;
color:#000;
}
/*************************************** Here is where the problem is on the page **********************************************************/
/*********************** this navbar should be touching the bottom border of the pageheader img. ****/

#navbar1 {
position:relative;
margin-top:-590px;
margin-left:525px;
padding:0;
background:transparent url() no-repeat;
width:150px;
border:5px groove #41646c;
}
#navbar1 ul {
margin:0;
padding:0;
}
#navbar1 li {
margin:15px;
height:15px;
padding:8px 10px 3px 5px;
background:transparent url() no-repeat;
list-style-type:none;
font-size:0.6em;
text-align:center;
color:#000;
}
#navbar1 a {
color:#000;
}
#navbar1 a:visited {
color:#a99806;
}
#navbar1 li:hover {
background:transparent url() no-repeat;
color:#123725;
}
#home .nav_home,
#aboutus .nav_about li,
#web .nav_web_services li,
#other .nav_other_services li,
#contact .nav_contact li {
background:transparent url() no-repeat;
}

#footer {
position:relative;
margin-top:400px;
background-color:#fff;
margin-left:65px;
width:609px;
border:5px double #fff;
}
#footer p {
text-align:center;
font-size:0.7em;
color:#000;
}

Aliquam erat volutpat.

• Aliquam erat volutpat.


• Aliquam erat volutpat.


• Aliquam erat volutpat.


• Aliquam erat volutpat.

• Home


• About


• Consulting


• Other
  Services


• Contact

Copyright © 2008 Phillip Ballew Sr. All rights reserved.