css pixel issue navigator/ie

Hi there,

I am back with another browser issue with css. When I set the position from the top on the center logo it shows correctly at top: 15px in IE but not in Navigator. To make it ok in Navigator I have to put it at 17px and then its off in IE.
I would love some help as i have a similar problem occuring in another site which I have also been trying to solve.
Here is the link: http://www.paintyourplace.com/emerald/

Here is the CSS:

body{
font-family: verdana, helvetica, arial, sans-serif;
margin: 0px 0px 0px 0px;
padding: 0px;
font-size:12px;
color: black;
background-color: #FFFFFF;
scrollbar-arrow-color:#003366;
scrollbar-face-color:#0C5331;
scrollbar-shadow-color: #9FB304;
scrollbar-highlight-color: #FFFFFF;
scrollbar-track-color: #CCCCCC;

}


#menuList {
margin: 0px;
padding: 0px;
}

#menuList ul {
margin: 0px;
padding: 0px;
}

#menuList li {
display: inline;
list-style: none;
}

a.actuator {
background-color: transparent;
color: #000;
font-size: 12px;
margin: 0px;
padding: 3px 6px;
text-decoration: none;
}

a.actuator:hover {

color: #990000;
}


.menu {
color: #000;
background-color: #EEE;
border: 1px solid #CCC;
position: absolute;
visibility: hidden;
}

.menu li a {
background-color: #EEE;
color: #000;
display: block;
font-size: 12px;
line-height: 1.75em;
margin: 0px;
padding: 0px 10px;
text-decoration: none;
}

.menu li a:hover {
background-color: #0C5331;
color: #EEE;
}

span.key {
text-decoration: underline;
}

#homeMenu { width: 120px; }
#aboutMenu { width: 120px; }
#productsMenu { width: 120px; }
#careersMenu { width: 120px; }
#customerMenu { width: 120px; }
#healthcareMenu { width: 120px; }
#contactMenu { width: 120px; }

a{
color:#990000;
font-weight:normal;
text-decoration:none;
}
a:visited{
color:#005940
}
a:hover{
color:#990000;
text-decoration:underline;
}



#mainMenu {

text-align: center;
color: #000;
margin: 0px;
padding: 0px 0px 2px 20px;
}

DIV.jill_toplogo{
align: left;
}

DIV.jill_leftgreen{
top: 75px;
background-color: #0C5331;
height: 95px;
position:absolute;
width: 50%;
}
DIV.jill_rightblue{
left: 50%;
top: 75px;
background-color: #254E7C;
height: 95px;
position:absolute;
width: 50%;
}

DIV.jill_centered_logo{
position:relative;
text-align: center;
top: 15px;


}
DIV.jill_greyback{
padding-top: 112px;
background-color: #E1E5E0;
position: absolute;
top: 60px;

width: 100%;
text-align: center;
font-size: 12px;


}

DIV.mainBox {
position: absolute;
top: 230px;
font-family: verdana, helvetica, arial, sans-serif;
font-size:12px;
left: 57px;
width: 80%;

}
#bottomText{
padding: 0px;
margin-top: 20px;
margin-bottom: 10px;
margin-right: 20%;
margin-left: 20%;
background: none;
border: none;
border-top: none;
text-align:center;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10px;
color: #ccc;
}

THANKS!!!!

I think I'm missing a level of nesting, so this isn't gospel. In the following,is there a reason for the logo div and the filler divs to have different placement references (position properties)? Something to play with—remove the top attribute from the logo div and see where its normal position would be in each browser. It may give you a clue about the 2px offset.

cheers,

gary

Hi Gary,

Thanks for the advice, I set the centered logo to postion: absolute and that solved the pixel issue. However, now I can't get it to center. I have tried all the things in my arsenal and I can see its some sort of interaction but am not sure what. I would love anymore feedaback. Here is the current .css for the items in quesiton:

DIV.jill_leftgreen{
top: 75px;
background-color: #0C5331;
height: 95px;
position:absolute;
width: 50%;
}
DIV.jill_rightblue{
left: 50%;
top: 75px;
background-color: #254E7C;
height: 95px;
position:absolute;
width: 50%;
}

DIV.jill_centered_logo{
position:absolute;
text-align: center;
top: 75px;



}
DIV.jill_greyback{
padding-top: 112px;
background-color: #E1E5E0;
position: absolute;
top: 60px;
width: 100%;
text-align: center;
font-size: 12px;

Thanks
Jill

Just go with the flow. Put this little bit wherever it belongs in the flow.cheers,

gary

HI Gary,

Thanks for the feedback, I can't seem to get it to work right off, but I"ll try fiddling around a bit more.

Cheers,
Jill

Thanks again,
I ended up putting the green and blue and logo sections into another box and that seems to have solved the problems for me.

Cheers,
Jill

Sorry, guess I didn't make that clear in my example.

gary

Hi Gary,

I probably skimmed right through it.....thanks again for the help!

Jill