Shifting elements within site pages

Posted on 2012-08-14
Last Modified: 2012-08-15
I'm getting a slight shift of all the content on 2 of the pages within my site.

Here's a link, and RESUME and REVIEWS are two pages shifting to the left compared to the other sections.

Help is appreciated.
Question by:KayaWasTaken
    LVL 42

    Accepted Solution

    The shift is caused by the addition of a vertical scroll bar on the right. If a page is shorter than your screen, you don't have a scrollbar. A soon as you visit a page that is longer, a scrollbar is added, and that reduces the width by about 20px, causing the page to shift slightly.

    A 'fix' for this is to force a scrollbar on every page, irrespective of the page length, You can do this by forcing the page to be at least 1px longer than the screen. Add the following to your CSS file:

    html {
    	min-height: 100%;
    	padding-bottom: 1px;

    Open in new window


    Author Closing Comment

    Gosh, I cannot believe I didn't see that (and I'm pretty sure I wouldn't have without your eagle-eye)... Thanks for the help!

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    What Should I Do With This Threat Intelligence?

    Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

    This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
    Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
    In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
    The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

    779 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    15 Experts available now in Live!

    Get 1:1 Help Now