Another IE Incompatibility Issue - Need Advice

Discussion in 'CSS' started by dr00t, Feb 14, 2009.

  1. #1
    I created a really cool custom group health insurance quote form for a friend's website... and it works great in Chrome, Safari, Firefox - BUT NOT IE.

    Once you get past the first section of questions and push "Next Page" - it breaks and the whole site shifts to the left side.

    Here is a link to my site where you can test and see for yourself: Click here.

    If anyone can please take a look and tell me what they think will fix the issue, I would love to know. Thanks in advance.
     
    dr00t, Feb 14, 2009 IP
  2. ExtremeData

    ExtremeData Well-Known Member

    Messages:
    450
    Likes Received:
    21
    Best Answers:
    0
    Trophy Points:
    125
    #2
    Try to remove the empty space on the right.
    When you click the next page button IE try to put your page into center of the screen and because there is a big empty space on the right the page goes to left to be centered.
    I have not tested yet but I think this is the problem.
     
    ExtremeData, Feb 14, 2009 IP
  3. dr00t

    dr00t Peon

    Messages:
    174
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    I am not really sure what big empty space you are talking about. Can you provide more details on what you mean?

    If this were true, then why wouldn't the page start out being broken and on the left side?
     
    dr00t, Feb 14, 2009 IP
  4. ExtremeData

    ExtremeData Well-Known Member

    Messages:
    450
    Likes Received:
    21
    Best Answers:
    0
    Trophy Points:
    125
    #4
    Did you see on any browser the bottom scrollbar appear? Just scroll on the right and you will see the empty space.
    Remove it and I think all will be fine.
     
    ExtremeData, Feb 14, 2009 IP
  5. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #5
    Ok, word of warning, this is going to sound a bit harsh - NOT because I'm trying to be mean, but because I'm being honest with you. Truth hurts.

    With 138 validation errors you do NOT have HTML, you have gibberish - if it works at all in standards compliant browsers it is because of automatic error correction NOT proper behaviors. That you managed that many validation errors in a transitional doctype on a page that has only 1.7k of actual text content shows a distinct lack of understanding what HTML is. Being 14k of markup for that page is also a good indication that the code is overthought and filled with hordes of unneccessary elements as that's at least double what should be needed for such a simple layout.

    The code itself is filled with some serious oddities - paragraphs around non-paragraph elements, paragraphs wrapping paragraphs, single row tables, single column tables, div's wrapping spans wrapping spans wrapping labels wrapping inputs - you've got sections using 500 bytes of code for form elements that should only take a quarter that. Much of that can be attributed to using that wform javascripted nonsense from formassembly.com - like most frameworks you get fat bloated rubbish thanks to taking a shortcut using coding techniques that are a decade or more out of date.

    That your page is this far along and you are JUST noticing problems in IE means the design process was also flawed - which is why I'd chuck it and start over using clean semantic markup. You mark up your content using semantic names with no concern for how it's going to look, using tags, classes and Id's that say what things are, THEN you bend that markup to your will using CSS - TESTING each section in ALL browsers as you work top-down - that will prevent you from getting all the way to the end then finding out you need to throw it all away and start over.
     
    deathshadow, Feb 14, 2009 IP