CODEWITHSUNDEEP
htmlcss
strangereu
strangereu

Reputation: 81

CSS footer overlapping my content

Hello I've made a fixed footer and its still overlapping my content even if my wrapper is set to padding: 100px;

HTML:

<div id="footer">
    <div class="copyright">
        <p>Copyright (c) 2016-2017 <?=$lang["website-title"];?> | All rights reserved.</p>
    </div>
</div>

CSS

#footer {width: 100%; height: auto; bottom: 0px; position: fixed;}
#footer .copyright {height: 30px; background: #171C21; line-height: 30px;}
#footer .copyright > p {color: #fff; text-align: center; font-size: 13px;}

Prev: https://awesomeness.adam.zur.io/

Upvotes: 2

Views: 64

Answers (1)

LOTUSMS
LOTUSMS

Reputation: 10240

Do this:

#wrapper .left-box .content > article {
   padding: 10px 10px 100px 10px;
   color: #fff;
}

Your padding-bottom:100px needs to be in the article container itself. There are other issues in your site that result to this, but that's another problem :)

FREEBIE

Fix the z-order in your header with this:

h3:first-of-type {
   z-index: 1;
}

Upvotes: 1

Related Questions