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
    New Coder
    Join Date
    Dec 2009
    Location
    UK
    Posts
    14
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Site shifting over a few pixels..??

    Hey,

    Basically i have decided to make a small personal website so that i can use it as a portfolio kind of thing.

    It just the basic layout out the moment but i have come across one problem. When i navigate through the site all is fine except for the work page which seems to get shifted over a few pixels. At the moment the only difference on the pages is the heading and that i have repeated the first div which is for different types of work...

    Any help would be amazing, iam stuck to think why repeating the div is coursing this..?

    www.tyler138.com

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,606
    Thanks
    6
    Thanked 997 Times in 970 Posts
    It’s the scrollbar. That page is longer than the others and when the content goes beyond the “fold” then the scollbar appears taking a little room of the viewport width. You can make the scrollbar always appear by setting html, body {height: 100.1%;}.

    And by the way: you forgot to specify a page background color. Please note that users can set their own browser default and you should alway set background, text, and link colors, and link behavior to override the user prefs. And on another note: the plural of “photo” is “photos”. Ever heard of the greengrocers’ apostrophe?

  • #3
    New Coder
    Join Date
    Dec 2009
    Location
    UK
    Posts
    14
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks works great...

    but it doesn't seem to work in Chrome or Safari, and ways to do it in those aswell??

  • #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 Tyler138
    Who can say how those browsers handle .1%?
    I think this will work in all browsers - html, body {overflow-y: scroll;}
    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
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Have you seen the scrollbars that IE8 adds to your site?
    In that browser, .container has both X and Y scrollbars.

    There is nothing that needs cleared inside .container... remove overflow:auto; there and the scrollbars go away.

    There are a few things the validator finds that need fixed. See the links about validation in my sig below.


    .
    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


  •  

    Posting Permissions

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