SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    Mar 2004
    Location
    Canada
    Posts
    43
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Amazon Product Previews causing horizontal scroll in IE7, can we fix?

    This has been so frustrating, I can't figure it out.

    When you visit the page, you'll notice in IE7 a horizontal scroll and a gap under the design, the Amazon Product Previews script is causing this. If you hover the pictures on the lower left, the product previews come into place and the scroll disappears even AFTER you remove the mouse from the image!

    If you view the site in Firefox, it's fine.

    Can you view the page and suggest what I can do to have it behave in IE7? I need it to look and behave how it is in Firefox, no Horizontal Scroll and no gap under the footer.

    The problem is here - http://www.rihannasite.info/

    Thank you for any help!

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,281
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    It looks like a yet another "haslayout" issue (see faq)

    Try adding this:
    Code:
    .n2 .popTitle {min-height:0;}

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,281
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    I assume you realise that its broken in IE6 completely with the right main content way down the page below the left column!

    You have overstated the width on #rightop making it too wide to fit because you have added 18px padding to the total width.

    Reduce the width accordingly.

    Code:
    #righttop {
        position: relative;
        width: 532px;
        height: 52px;
        padding: 0 0 0 18px;
        background: url('http://www.rihannasite.info/images/righttop.gif') no-repeat left top;
        text-align: left;
    }
    I can't do anything about the gap at the bottom of the page though.

  4. #4
    SitePoint Enthusiast
    Join Date
    Mar 2004
    Location
    Canada
    Posts
    43
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you Paul, you're a great help. How did you know the solution? I have never heard of "haslayout" I'll go read about that.

    Also, I don't have a way to view my site's in IE6, I am glad you pointed that out. I should have known cause I normally make sure to compensate my widths accordingly if I've called for padding.

    This is much better without the horizontal scroll! Thanks again!

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,281
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Also, I don't have a way to view my site's in IE6
    You can download the IE standalones from here but they aren't perfect and crash quite often but I use them all the time.


    I have never heard of "haslayout"
    It's the biggest cause of all problems in IE and is responsible for all the weird bugs that have been given silly names over the years. There's an entry in the FAQ with links to definitive information about this


Bookmarks

Posting Permissions

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