I have navigation element (ul , li, a and span) inside two divs. I'm trying to give a tag wich holds one of the two background images (another one is on the span element) a margin-bottom: 15px to make it push other elements away to greate a nice hover effect.

Here is the css:

#low_nav {
width:100%;
float:left;
background:#fff url(../images/layout/grey_border.gif) bottom left repeat-x;
padding:2px 0 0;
}

#low_nav_inner {
width:100%;
float:left;
background:url(../images/layout/grey_border.gif) top left repeat-x;
}

#low_nav ul {
float:left;
display:inline;
margin:0 0 0 30px;
padding:0;
}

#low_nav ul li {
float:left;
list-style:none;
display:inline;
margin:0 0 0 3px;
}

#low_nav ul li a {
text-decoration:none;
display:block;
color:#585858;
float:left;
background:url(../images/layout/tab_right.gif) bottom right no-repeat;
margin:0 0 15px; /here is the rule that dosent work on IE6/
}

#low_nav ul li a span {
background:url(../images/layout/tab_left.gif) bottom left no-repeat;
display:block;
float:left;
padding:8px;
}

Problem is that all other (padding, margin-up, -left,-right) works just fine on a tag, put margin-bottom dosent do nothing on IE6xx. CSS and XHTML marup is valid and I'v made sure that there is no margins that could cause the quirks mode. Please help.