Grow your CSS skills. Land your dream job.

[Solved] Horizontal Scroll bar suddenly appearing

  • # February 2, 2010 at 3:37 pm

    Hi all,

    I’m working on a new WP site for my portfolio and sometime this AM I must have done something that’s creating a horizontal scroll bar to appear until the browser window is at about 1000px wide.

    I’ve been searching for an hour now to figure out what I did. I need another set of eyes. I’m thinking I must have left a <div> open somewhere or something similar.

    Can anyone see the error? Thanks in advance for any and all help.

    http://www.jerryrossphotography.com

    MJK
    # February 2, 2010 at 4:04 pm

    It looks like the problem is in your CSS. The following line in style.css doesn’t need to be so wide.

    Code:
    #masthead { position: relative; top: 0; left: 0; width: 960px; height: 196px; }
    # February 2, 2010 at 4:07 pm

    I am not very good with WordPress, but I think it may have something to do with this file
    body class="home page page-id-19 page-template page-template-homepage-php"
    when I set the width in css of body to 80% the scroll bar disappeared.

    # February 2, 2010 at 4:13 pm

    Your navigation is causing the problem. If you give it a width of 500px or so that should take care of the problem.

    Code:
    #main-navigation { left: 350px; position: relative; top:110px; width: 500px; }
    # February 2, 2010 at 4:49 pm

    Looks like this problem has been fixed?

    # February 2, 2010 at 6:36 pm

    Wow! I ran to the store and came back and their were several replies already. Thanks everyone for the input. The suggests help me get focused again. It turns out that it was the footer that was missing a width value and thus causing the page to be too wide. The nav in turn was just expanding into the available space.

    Thanks to all.

    jr

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".