Problem with float and IE6

I have problem with floating in IE6. The HTML code:

<div id="stran">
    <img src="../Slike/prejsnja.png" alt="Prejšnja" onclick="prejsnja();" onmouseover="this.style.cursor='pointer';" id="prejsnja" />
        STRAN <?php dobiStran(); ?>
    <img src="../Slike/naslednja.png" alt="Naslednja" onclick="naslednja();" onmouseover="this.style.cursor='pointer';" id="naslednja" />
</div>

CSS:

#prejsnja {
float: left;
}

#naslednja {
float: right;
}

#stran {
position: relative;
width: 400px;
border: 2px black solid;
margin: 0 auto;
font-family: "Comic Sans MS";   /*Izberemo drugo pisavo, kot pa tista ki je definirana v body.*/
color: #599cd4;
text-align: center; /*Postavimo na center.*/
font-size: 30px;    /*Vecja pisava, ker gre za naslov.*/
}

The left image floats to the left, as it should, the text is centered, the right开发者_JAVA技巧 image also floats to the right as it should, but has for some reason some kind of margin-top, that only appears in IE6. Here is example in other browsers:

And in IE6:

---

Try moving your HTML elements around a bit, like this:

<div id="stran">
    <img src="../Slike/prejsnja.png" alt="Prejšnja" onclick="prejsnja();" onmouseover="this.style.cursor='pointer';" id="prejsnja" />
    <img src="../Slike/naslednja.png" alt="Naslednja" onclick="naslednja();" onmouseover="this.style.cursor='pointer';" id="naslednja" />
        STRAN <?php dobiStran(); ?>
</div>

And then your styles become:

#prejsnja {
  float: left;
  width: 100px;
}

#naslednja {
  float: right;
  width: 100px;
}

#stran {
position: relative;
width: auto;
border: 2px black solid;
margin: 0 auto;
font-family: "Comic Sans MS";   /*Izberemo drugo pisavo, kot pa tista ki je definirana v body.*/
color: #599cd4;
text-align: center; /*Postavimo na center.*/
font-size: 30px;    /*Vecja pisava, ker gre za naslov.*/
}

I've assumed your arrow images are 100px, but just change these to whatever it is they actually are.