a span floated right within a div - why a new line in IE?

Question

I have 1 span within a container div. I want the span floated to the right. The content within the div and the span should be on one line.

In Firefox, that's how it displays.

But in IE, the span is displayed on a new line:

http://i48.tinypic.com/etzg5f.png

Why do the browsers display the content differently?

Answer 1

You should float the other content to the left. So have two floats; left and right.

Another approach could be using position absolute on the span, andposition relative on the surrounding div. Then you could put the positions (top, left, right and bottom) and position the elements as you should!