views:

352

answers:

2

How come when I have a div style at display: block; float: right, in IE6 the div still goes under the text, and not in the middle of it just floated to the right. It works in all other browsers, including IE7+. I need to have display block because if i do display inline, then the menu inside the div is all messed up.

.content { display: block; }

.float { width: 150px; display: block; float: right; }

.nothing { display: inline; }

the float class is not to the right of nothing class, its under it in IE6, know a fix?


I'm assuming this is what is meant:

<span>This is some text </span>

<div style="float: right;">
    This is floated text
</div>

The output is something like this:

This is some text    
                        This is floated text

If you float the span left, or

<span style="float:left;">This is some text </span>

<div style="float: right;">
    This is floated text
</div>

switch the order of the text and float

<div style="float: right;">
        This is floated text
</div>

<span>This is some text </span>

it works properly:

This is some text    This is floated text
A: 

This may not be an option in your case, but maybe you could try float: left with align: right in the parent element? This has worked for me in the past, but is not useful in every case.

nbolton
A: 

Follow the link Greg posted in a comment (doctype.com/wierd-ie6-float-issue) for a working solution. Basically put you floating element first in the html.

Jakub Konecki