IE7 unwanted scrollbars

Discussion in 'CSS' started by jtpratt, Sep 16, 2008.

  1. #1
    jtpratt, Sep 16, 2008 IP
  2. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #2
    It's doing what you told it. Using shifted relative position works differently than you expect. You need to study §9 of css2.1.
    div#ads {  /*style.css (line 42)*/
    left:372px;
    margin:0;
    padding:0;
    position:relative;
    }
    Code (markup):
    Instead of rel. pos. and shifting, try {float: right;}, or use absolute positioning. Both have their own gotchas. Study §9, ref'd above.

    cheers,

    gary
     
    kk5st, Sep 16, 2008 IP
  3. jtpratt

    jtpratt Well-Known Member

    Messages:
    170
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    123
    #3
    Gary -

    I thank you for the help. That actually was not the problem - and that section was working properly...but you led me to find the real issue.

    the wrapper div had the overflow set wrong -
    overflow:auto;

    I changed it to -
    overflow:hidden;

    and the scrollbars are gone for good! I thank you for your help.



     
    jtpratt, Sep 16, 2008 IP
  4. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #4
    No, that section was/is not working properly. That you need overflow hidden only masks an undesirable result of crappy coding. You obviously don't understand the ramifications of shifting relative positioned elements. Read and reread the cited css2.1 section 9 until you understand it.

    Removing the relative positioning removes the problem. Floating #ads right puts the ads where you want them.

    There may be some tweaks needed, but that is the approach to take.

    gary
     
    kk5st, Sep 16, 2008 IP
  5. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #5
    The scrollbars where there because you were pushing something too far off to the size with rel positioning. Overflow:hidden only hides it. (Actually, I though this didn't work in IE? Or overflow just doesn't wrap floats in IE?)

    You can vacuum the dust up, or sweep it under the carpet.
     
    Stomme poes, Sep 17, 2008 IP
  6. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #6
    The latter, except that IE7 causes overflow other than visible to trigger hasLayout. That, of course, contains floats, but isn't exactly the same as creating a new block formatting context.

    :D

    cheers,

    gary
     
    kk5st, Sep 17, 2008 IP