Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

IE page rendering issues

Options
  • 06-05-2007 11:34am
    #1
    serotonin_sam
    Closed Accounts Posts: 204 ✭✭


    I have a straightforward css based layout here I have a javascript based navigation menu places in the left hand column and 4 images placed in the right hand column. The page displays fine on Firefox and on IE6 with Active X disabled. However, if the IE browser has active x enabled, it pushes the right hand side column underneath the rest of the page. This online webpage renderer shows that it has a different rendering problem with IE ver. 5.5.

    I have done some searching/reading and all I can find are suggestions to enter some code on the .css page - to change the width of the page if opened by an IE browser. However, whilst i'm not clear on how to do this, I am not convinced in this case that this is the solution either.
    How is it that whether Active X is enabled or disabled is having an effect on page rendering?

    Edit: forgot to mention - i've ran the page through a markup validator and it passes 100% for xhtml 1.0 Strict so no problems with the code itself


Comments

  • Options
    #2
    DonkeyStyle \o/
    Closed Accounts Posts: 7,145 ✭✭✭DonkeyStyle \o/


    Enabling activex to the point where the menus drop-shadow is active results in a 1 pixel widening of the left column, which pushes the other columns right by the same amount... possibly the source of your wrapping issue (?).

    Though even with IE6 and scripting disabled (along with the drop-shadow) the left column is 2 pixels wider in IE6 than firefox (+3 pixels in total with the menu drop-shadow)... IE box model/padding interpretation? I'm not sure.

    For me, even with activex disabled, the right column is still appearing underneath the others.
    Is the nav menu drop shadow appearing/disappearing in conjunction with what you're seeing with the dropping of the right column?

    -2c


  • Options
    #3
    serotonin_sam
    Closed Accounts Posts: 204 ✭✭serotonin_sam


    DonkeyStyle \o/ wrote:
    Though even with IE6 and scripting disabled (along with the drop-shadow) the left column is 2 pixels wider in IE6 than firefox (+3 pixels in total with the menu drop-shadow)... IE box model/padding interpretation? I'm not sure.
    Yeah - all the reading i've done suggest that its the whole IE box model/padding interpretation thats causing it..Its just the Active X thing thats confusing me as regards cause.
    DonkeyStyle \o/ wrote:
    For me, even with activex disabled, the right column is still appearing underneath the others.
    Is the nav menu drop shadow appearing/disappearing in conjunction with what you're seeing with the dropping of the right column?
    ??? The nav menu will not work on IE without active x being enabled. In order to circumvent this, theres a simple list menu in place (which also makes it search engine friendly). When testing with active X disabled, it appears alright???


  • Options
    #4
    DonkeyStyle \o/
    Closed Accounts Posts: 7,145 ✭✭✭DonkeyStyle \o/


    Ooooh, sorry, my bad... I hadn't disabled activex properly. :o
    Yeah it looks fine with AX disabled, and it's pixel perfect against how FF is rendering it... none of the width fluctuations at all.
    I'll just put my idiot hat back on and sit in the corner quietly.

    Usually I just avoid the whole headache by leaving more slack space between columns... like if you reduce the width of one of the columns by just enough so that tiny width changes in another column won't cause it to get wrapped.


  • Options
    #5
    serotonin_sam
    Closed Accounts Posts: 204 ✭✭serotonin_sam


    In order to accomodate IE6, I've reduced the width of the right hand column by one pixel. However, it means that the right hand side of the site (header/rhs column/footer) don't line up 100% - and looks a bit shabby. Rendering in IE5.5, it looks absolutely awful. How the hell do I get past this mess?


  • Options
    #6
    DonkeyStyle \o/
    Closed Accounts Posts: 7,145 ✭✭✭DonkeyStyle \o/


    I'd say align the center and right column to the right and force the left column flush to the left by floating it left... letting the gutter between the columns absorb the difference.
    There are plenty of examples out there of CSS layouts that work... maybe you could adapt one for your needs.
    Or you could be sinful and dirty and lay it out with tables ;)


  • Advertisement
  • Options
    #7
    serotonin_sam
    Closed Accounts Posts: 204 ✭✭serotonin_sam


    DonkeyStyle \o/ wrote:
    I'd say align the center and right column to the right and force the left column flush to the left by floating it left... letting the gutter between the columns absorb the difference.
    There are plenty of examples out there of CSS layouts that work... maybe you could adapt one for your needs.
    Or you could be sinful and dirty and lay it out with tables ;)

    Thanks DS. I have floated the right hand column to the right. It looks fine now on firefox (i'm assuming it works ok on all versions?? - I only have ver. 2.0.0.1) and IE 6 & 7. IE 5.5 isn't so hot - but it accounts for somewhere between 1.5-2% of my visitors and should be diminishing. I will live with it (unless someone else knows an easy fix).
    As regards tables, I really don't want to fiddle with it any more! Time is a thief - have other things to look after. No doubt at some stage, I will come back and try and improve it again.


Advertisement