• Was wondering if someone could take a look at my site, IE isn’t rendering my menu correctly. It looks perfect in mozilla firefox.
    The basic page layout consists of 3 div sections (rap, menu, and content)…the menu is set to float right (width=160px) while the content is set with a margin-right of 165px. You’ll notice that the menu is spilling over onto the content div (or vice versa).
    Not sure if I’ve done something wrong or it’s just IE being non-compliant.

Viewing 7 replies - 1 through 7 (of 7 total)
  • bmccullo,
    I’m having a quick look. IE, as you are well aware, is a POS browser. That being said, there are usually fixes for everything. One thing that stands out right now, is that you have your #rap and #header as 800px wide. I’d suggest dropping that to, say, 770px, to prevent the dreaded horizontal scrollbar from appearing.
    What about giving #content an actual width value? Maybe experiment with that. There are lots of really smart CSS people around, too. We’ll get you fixed up. 🙂
    Craig.

    I am going to stick my neck out a bit. I have tested the page across the full range of IE browsers. With variations they all show the same error. That includes IE 6.
    I have had a look at the css. For what it is worth , and I say this with some hesitation – the error might be in the html. I have had a look and I am not sure that all the divs are closed correctly. I have to say I did not spend a lot of time on it, but the consistency of the error across browsers is not immediately resonant of any of the known MS IE peculiarities. Hope this is not a bad steer,
    but I can not see anything untoward in the css. Good luck.

    as Root said, it’s probably an unclosed div tag, FireFox recognises errors like that and displays properly, IE doesn’t.

    Thread Starter bmccullo

    (@bmccullo)

    Okay, thanks alot guys.

    Thread Starter bmccullo

    (@bmccullo)

    I think I’ve got it fixed. I had to apply a width to #content just like NuclearMoose suggested. I set it to something too small (eg 300px) and stepped it up until IE couldn’t handle it correctly. Consequently, the distance between #menu and #content are now greater than I would prefer when using mozilla, but it looks fine IE. An acceptable trade-off. I also went through my HTML and commented all the divs to make sure they were all closed correctly (they were).
    Thanks for the tips guys.

    eliallan,

    …it’s probably an unclosed div tag, FireFox recognises errors like that and displays properly, IE doesn’t.

    It’s been my experience that Firefox, being the more rigid in standards-compliance than IE, usually SHOWS the problems by NOT forgiving mistakes. IE forgives nearly everything. For this reason, I would suggest that if it works fine in Firefox or Mozilla, then likely there is a hack or workaround needed to fix up IE.
    “Of course, I may be wrong; it’s only my opinion.” 🙂
    Craig.

    Well NM was spot on. There was a fixed width with padding and margins in one div. The IE miscalculation of width is well known. But heck, it seems to do it in all browsers now. It can’t be getting worse;) That is a beautiful looking site and you must be pleased you are now pixel perfect. Good luck.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘IE render problems’ is closed to new replies.