CODEWITHSUNDEEP
internet-explorer-7css-floatalignmentinternet-explorer-6
Michael Frey
Michael Frey

Reputation: 918

IE7 div floating bug

I have the following

<div id="border" style="width:100%; border:8px solid #FFF">
    <div id="menu" style="width:250px; float:left;" >
        Some menu
    </div>
    <div id="content" style="padding-left:270px; width:520px;" >
        Main page content
    </div>
</div>

This gives me a left aligned menu and the content to the right of it, all surrounded by a border.

On all browsers including IE8 it displays correctly.

But on IE7 the content only starts below the menu, and leaves a big open space to the right of the menu.

I have searched all kind of solutions and tried all kinds of combinations of right, left, none for float. clearing left right both. It always displays different on the browsers.

Any help is appreciated. Michael

Upvotes: 3

Views: 3135

Answers (1)

NibblyPig
NibblyPig

Reputation: 52942

Remove the padding on your content div and set it to float left.

You might have to put <div style="clear: left"></div> after it

Upvotes: 3

Related Questions