CODEWITHSUNDEEP
htmlcss
user1692620
user1692620

Reputation:

Fixed header, DIV sitting behind not under

I have a small problem if anyone can help. I'm probably being really stupid but I can't seem to get my DIV to sit under my fixed header as it's currently sitting behind.

</body>
    <div id="container">
        <div id="header">
        </div>
        <div class="home">
            <img src="images/home.jpg" alt="" height="563" width="760">
        </div>
    </div>
</body>

body {
    text-align: center;
}

#container {
    width: 760px;
    margin-left: auto;
    margin-right: auto;
}

#header {
    padding-top: 250px;
    position: fixed;
    background-image: url(images/logo.png);
    background-repeat: no-repeat;
    background-position: 50% 40%;
}

.home {
}

Edit: another thing to not is in the header there is a basic CSS menu, didn't think the code was necessary for this issue.

Upvotes: 5

Views: 23022

Answers (1)

scottlimmer
scottlimmer

Reputation: 2268

Positioning absolute/fixed takes the div out of the flow of the document. To get the .home to sit below the header you would need to give it margin-top equal to the height of the header

Upvotes: 9

Related Questions