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 5 of 5
  1. #1
    Regular Coder
    Join Date
    Oct 2008
    Posts
    185
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Scroll Bars Appearing in Opera and IE8

    Please check my home page: http://www.americanchic.net/

    You'll see that in IE8, scroll bars are appearing at the bottom and right sides of the contentwrapper div. In Opera, a scroll bar is appearing at the bottom of the contentwrapper div. Why is this happening?

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,855
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    It might be due to the overflow:auto; applied to that div. If you are using that property for clearing the floats, you may need to switch the other method which uses an extra element, see http://www.codingforums.com/showthre...640#post617640

    btw, I'd recommend you to use a CSS based layout like http://bonrouge.com/2c-hf-fixed.php, since the use of tables for layout is stupid!
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    Regular Coder
    Join Date
    Oct 2008
    Posts
    185
    Thanks
    12
    Thanked 0 Times in 0 Posts
    Thank you for the tip. At this point of designing the website, I can hardly go back and remove the tables. It would require too much work. Everything was fine before I added that image to the bottom of table.contentindex (this is the image: http://www.americanchic.net/home_pag...e_shopping.jpg ).

    Here is the same page that does NOT contain that bottom image:

    http://www.americanchic.net/home2.html

    ... and there are no scroll bars... ?

    (Actually there is still a scroll bar in Opera 10.10) What's important are the scroll bars in IE8...

  • #4
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello jihanemo,
    It seems your box model is off a few pixels. I think the math works on all the elements inside #outerwrapper so there must be some IE bug being invoked.

    */edit - on further inspection I'm pretty sure it's your imagemaps that are causing this. <map name="homepageimage"> and <map name="continueshopping">


    If you try adding a few pixels to the width of #outerwrapper, the x scrollbar goes away. Try this once -
    Code:
    #outterwrapper {
    margin: 10px auto 25px;
    width: 867px;
    background: #fff;
    overflow: auto;
    }
    Ab is right, at this point the easiest fix might be removing overflow:auto and placing a 1px high clearing div at the end of the content of #outerwrapper.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #5
    Regular Coder
    Join Date
    Oct 2008
    Posts
    185
    Thanks
    12
    Thanked 0 Times in 0 Posts

    Resolved

    Aahh, gotcha. Thank 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
    •