I have an <a> element set to display:block, inside of which is some text and a png image. The <a> is set to text-align:right and the image is set to float:right.
It's fine in all browsers except IE (8, but haven't tried with earlier versions of IE), which displays the image below the text. If I do the old negative margin trick, it overlays the image on top of the text.
Note that I had to include the X-UA-Compatible meta tag to make the scripts work at all (jQuery).
I know IE has been tweaky with both png and float. It's possible to set margins and such to get them to look okay, but does anyone have thoughts about why they aren't just flowing together?
Note: I tried tests with text and the img in a regular div and it's the same issue.