Troubleshooting Layout for IE

Discussion in 'Web Design and Development' started by Mal, Mar 4, 2009.

  1. Mal macrumors 603

    Mal

    Joined:
    Jan 6, 2002
    Location:
    Orlando
    #1
    http://www.japancpi.com/

    I need help troubleshooting this layout for IE 6+. It appears that the width of the main content div is about a third of what it should be, which is really messing up the layout. I haven't been able to find the problem, but I also don't have a test system of my own, which doesn't help.

    Any advice would be greatly appreciated!

    Feel free to comment on the other design elements too.

    Thanks!

    jW
     
  2. torndownunit macrumors regular

    Joined:
    Jan 4, 2009
    #2
    Mal, I am no expert and this is my first attempt at answering a question by looking through code. So I may be way off and if so I apologize. I am just trying to participate.

    Should #content have a width set? I didn't see one, but there is a width set in the page code for the object ( <object width="600" height="400"> ) . At a glance, and with my limited skills, it seems like that might be an issue.

    Thanks
     
  3. wheelhot macrumors 68000

    Joined:
    Nov 23, 2007
    #3
    Well I assume you tested your site on real browsers such as Firefox, Safari, Opera?

    If the problem only appears in IE, I suggest you to do IE specific hacks or create another CSS file only for lamo IE.

    IE is the worst browser in the world and should be put down from the internet, its slowing down web development and making more people getting stressed up. Screw IE!!! :mad:
     
  4. Mal thread starter macrumors 603

    Mal

    Joined:
    Jan 6, 2002
    Location:
    Orlando
    #4
    Thanks for that, that's the type of thing I knew I was probably missing. I'll try that later today and post back.

    Sorry dude, I know IE's bad, but if I want real people to read it, I unfortunately can't yet code only for real browsers.

    I think in this case I likely won't need IE hacks, but the problem now isn't so much whether I can make the code work in IE as what's not working.

    jW
     
  5. Mr.nix macrumors member

    Joined:
    Jan 30, 2007
    #5
    Just looking at your code real quick and IE is doing what you're telling it to do.

    A couple of things I would fix.

    - Use a global reset
    - You have some unnecessary div. Don't need a top and pageHeader. Don't need the select div. Just the few I looked at.
    - For all floated content add display:inline;
    - Search google for the IE version of min-height. Its pretty easy.

    You don't need another style sheet for IE, if you code it right they will all play together.
     
  6. Mal thread starter macrumors 603

    Mal

    Joined:
    Jan 6, 2002
    Location:
    Orlando
    #6
    So I added the width to the content div, plus a few of the other suggestions (didn't implement a global reset yet, will have to read up on that and make sure I do it right), so can anyone check if this is working correctly now? Thanks!

    jW
     
  7. miles01110 macrumors Core

    miles01110

    Joined:
    Jul 24, 2006
    Location:
    The Ivory Tower (I'm not coming down)
    #7
    Unfortunately IE isn't going away any time soon.
     
  8. torndownunit macrumors regular

    Joined:
    Jan 4, 2009
  9. torndownunit macrumors regular

    Joined:
    Jan 4, 2009
    #9
    Mal, on IE 7 the display is matching what I see on Camino and Safari. So it appears to be fixed.

    The only difference being a VERY small difference in the gap below the "You can also visit the Japan CPI organization's website at JCPI.net." text.

    But to be honest, the spacing of the text, and the gaps above and below actually look a little bit better in IE.

    Sorry I can't give a report on IE6, but I don't have it installed.
     
  10. Mal thread starter macrumors 603

    Mal

    Joined:
    Jan 6, 2002
    Location:
    Orlando
    #10
    Thanks! I'm not too worried about the exact spacing, though I expect if I get around to installing a global reset it would help me take care of that. I wouldn't even have worried about it if I didn't know for sure I had people needing to view the site in IE 6-7.

    jW
     
  11. torndownunit macrumors regular

    Joined:
    Jan 4, 2009
    #11
    The spacing issue I mentioned is likely not even worth worrying about. I mean, I'm talking about maybe a 5-10 pixel difference in the 2 layouts. There is no way most people would even notice it.

    I don't have IE 6 as I mentioned, but you could probably just run the site through one of those browsershot sites to see what it looks like. They are good enough for testing something that small. I think the address of one of them is browsershots.org .
     
  12. FourCandles macrumors 6502a

    Joined:
    Feb 10, 2009
    Location:
    England
    #12
    One I've used is http://ipinfo.info/netrenderer/
     
  13. Mal thread starter macrumors 603

    Mal

    Joined:
    Jan 6, 2002
    Location:
    Orlando
    #13
    I submitted the request to browsershots.org, and got back two screenshots from IE 7 and IE 6, but the video has now been bumped down below the menu. Maybe I just need to play with the widths a bit, but I'll have to look at the sizes.

    jW
     

Share This Page