SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Nov 2006
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to Remove Unintended Horizontal Scroll Bar

    Hi, I have an unintended horizontal scroll bar on my site because for some reason, the width defaults to several pixels wider than the browser screen, no matter what resolution.

    Apple iPhone Review

    Any suggestions on how to remove it?

    Thanks for your help as always.

    Chris
    Apple iPhone Review
    iPhone insights, reviews & how-to's from a non-fanboy

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,173
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    You can't have an element set to width: 100% and have left-right padding/margin on it too. You have this on quite a few elements. For outer elements, just use width: 100%, and for inner ones, remove the width setting and just use the padding. Here are some examples of rules with that problem:

    Code:
    #header {
      background: url("http://www.appleiphonereview.com/wp-content/themes/Apple%20iPhone%20Review/images/headerbg.gif") repeat-x scroll 0 -10px transparent;
      height: 78px;
      margin: 0;
      padding: 5px 0 0 2px;
      width: 100%;
    }
    
    #footer {
      background: url("http://www.appleiphonereview.com/wp-content/themes/Apple%20iPhone%20Review/images/footerbg.gif") repeat-x scroll 0 0 transparent;
      border-color: #CCCCCC #999999 #999999 #CCCCCC;
      border-right: 1px solid #999999;
      border-style: solid;
      border-width: 1px;
      height: 56px;
      margin: 0 0 2px;
      padding: 0 5px 0 0;
      width: 100%;
    }
    
    
    #subnav_body {
      line-height: 16px;
      margin: 0 auto;
      padding: 0 5px;
      width: 100%;
    }
    
    #header_body {
      height: 78px;
      margin: 0 auto;
      min-width: 780px;
      padding: 0 0 0 5px;
      width: 100%;
    }
    
    #topstrip_body {
      margin: 0 auto;
      padding: 0 5px;
      width: 100%;
    }

  3. #3
    SitePoint Enthusiast
    Join Date
    Nov 2006
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Seems to have worked. Thanks so much, Ralph! This had been bugging me for some time.
    Apple iPhone Review
    iPhone insights, reviews & how-to's from a non-fanboy

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,173
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Fantastic! Glad it was that easy.


Tags for this Thread

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
  •