IE6 Padding/Margin Issue

HTML & CSS
1

Does anyone know why IE6 is putting a large gap between the search input and the magnifying glass on this page:

http://toomanydesigns.com/thefix/top10_watches/

Thanks!

2

Hi I would try moving the form before the nav and floating it right.
I’m not sure how an inline element would behave there.

I beieve in IE you need to have the right float first in the source order.

Hope it helps,

3

You shouldn’t have to float the image input - all inputs are inline elements anyway, so they’ll sit on the same horizontal plane by default.

4

Hi,

You can’t float left and right in a widthless floated parent as IE7 and under will stretch the parent to the whole available width.

Just float the input to the right and add position:relative to the parent so that IE7 show it all (another bug).


.mini-search {
    margin-top:3px;
    float:right;
 [B]   position:relative;[/B]
}
.input-text {
    width:213px;
    height:15px;
    border:1px solid #000;
    padding:5px;
    font-size:13px;
    overflow:hidden;
[B]    float:right;[/B]
    color:#555;
    font-weight:normal;
    margin-right:10px
}
5

fixed…thanks.