WordPress.org

Ready to get started?Download WordPress

Forums

IE render problems (8 posts)

  1. bmccullo
    Member
    Posted 9 years ago #

    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.

  2. NuclearMoose
    Member
    Posted 9 years ago #

    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.

  3. Root
    Member
    Posted 9 years ago #

    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.

  4. Anonymous
    Unregistered
    Posted 9 years ago #

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

  5. bmccullo
    Member
    Posted 9 years ago #

    Okay, thanks alot guys.

  6. bmccullo
    Member
    Posted 9 years ago #

    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.

  7. NuclearMoose
    Member
    Posted 9 years ago #

    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.

  8. Root
    Member
    Posted 9 years ago #

    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.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.