Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder croatiankid's Avatar
    Join Date
    Jan 2006
    Posts
    665
    Thanks
    1
    Thanked 12 Times in 12 Posts

    ALA container-less holy grail layout fix for IE7 plz

    Could you write me something that could get IE7 to render this as it's rendered in every other browser? The only difference I see is a horizontal scrollbar appearing- and it leads to: nothing. white space.
    So could you write some kind of expression I'd stick in ie7-only conditional comments that would remove the need for the horizontal bar showing, without messing something up? Since only IE7 would view it anyway, there would be no need to worry about other browsers.
    Thank you very much if someone would be so kind as to write this!

    edit: this isn't homework. I'm just not able to get alistapart's 3 column fluid layout working in IE7 using ANY method (this doesn't even work for me)
    Last edited by croatiankid; 01-02-2007 at 08:43 PM.

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    And you think this requires javascript why? What exactly have you coded? We aren't here to just give you code. Show some initiative.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    Regular Coder croatiankid's Avatar
    Join Date
    Jan 2006
    Posts
    665
    Thanks
    1
    Thanked 12 Times in 12 Posts
    The second link gives a javascript fix.
    Instead of considering the width of the surrounding div container, IE7 inserts the width of the body, which leads to the left column being moved out of sight to the far left. Here's how to fix it.
    Code:
    #left {
    width: 200px; /* LC width */
    margin-left: -100%;
    left: 150px; /* RC width for IE6 */
    }
    
    #container > #left {
    left: -200px; /* -LC width for others */
    margin-left: expression(document.all.center.offsetWidth * -1); /* Fix for IE7 */
    }
    But I'm using the version with padding so
    In the case of the padded version, the left and right padding of the left and the left padding of the center column must be added to the margin like this:
    Code:
    #container > #left {
    left: -200px; /* -LC width for others */
    margin-left: expression(
    document.all.center.offsetWidth * -1 +
    parseFloat(document.all.center.currentStyle.paddingLeft) +
    parseFloat(document.all.left.currentStyle.paddingLeft) +
    parseFloat(document.all.left.currentStyle.paddingRight)
    ); /* Fix for IE7 */
    }
    But instead of giving me what it shows in other browsers here, I get this.
    Important: I no longer need your help. I got a reply on that blog post, and it seems I misinterperetted the post. I didn't know I had to apply this first. Sorry for troubling you.bling you.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •