CODEWITHSUNDEEP
htmlcssinternet-explorer-9
lightburst
lightburst

Reputation: 231

broken css on internet explorer

I have a web project that just breaks when I run it on Internet Explorer. Here it is, working as I want it to, on jsfiddle.

On IE, the display_area goes up and mixes with the toolbar up top. Also, the posts mixes into the side_display_area instead of them being confined to main_display_area, as is on the jsfiddle.

Upvotes: 0

Views: 1605

Answers (2)

lightburst
lightburst

Reputation: 231

The problem I had was because IE, by default, uses 'Quirky' mode for its CSS rendering for the sake of compatibility with older code that was written ad hoc for IE. Although IE currently has different standard compliant modes(I can't attest to how compliant, however), it still defaults to this compatibility mode.

The solution is to override, or explicitly set, the rendering mode of IE via the X-UA-Compatible header. You can do this through html tags with:

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
</head>

more info

Upvotes: 3

CMartins
CMartins

Reputation: 3293

I think this may help http://css-tricks.com/the-css-overflow-property/

Consider adding some div to you horizontal menu and put some height on that 

div.hmenu {
    margin-left:auto;
    margin-right:auto;
    height: 20px;
    min-width:1000px;
    max-width:90%;
    overflow:auto;
}

Upvotes: 0

Related Questions