Scroll Bar Suddenly not working in my page

Question

Here is the site i am building from scratch. Suddenly at one point browser scroll bar disappears. How to fix it?? MY WEBSITE

Use (ctrl + (+)) OR (ctrl + (-)) to zoom in or zoom out the website.

Answer 1

The problem you are having is that you have a lot of things that are position: fixed;

If you are doing this from scratch... I suggest you start over. I built THIS in jsfiddle in 3 minutes. This is how you would build a site like this now days. This is starting mobile first as well... so with some media queries and a responsive slider, you should have a much more solid foundation. I hope it is helpful. Fixed positioning pulls the content out of flow and then the browser doesn't see how "long" it is, and therefore removes the need for scrolling. As you using dream weaver or something? If so, I can see how this happened. You should probably go with an html 5 doctype as well. Take a deep breath and rethink this.

HTML

<header class="global-header">
    <div class="inner-w">
        HEADER
    </div> <!-- .inner-w -->
</header>

<section class="main-content">
    <div class="inner-w">

        <div class="block">block</div>

        <div class="block">block</div>

        <div class="block">block</div>

    </div> <!-- .inner-w -->
</section> <!-- .main-content -->

CSS

html, body {
    margin: 0;
    padding: 0;
}

.global-header {
    width: 100%;
    float left;
    min-height: 150px;
    margin-top: 20px;
    margin-bottom: 20px;
    background-color: lightblue;
}

.main-content {
    width: 100%;
    float: left;
}

.inner-w {
    margin: 0 auto;
    max-width: 900px;
}

.block {
    width: 100%;
    float: left;
    background-color: #f06;
    min-height: 200px;
    margin-bottom: 20px;
}