CODEWITHSUNDEEP
htmlcssfooter
Kuba
Kuba

Reputation: 149

Footer is scrollable horizontally but it shouldn't

I created my site and the footer of it is scrollable horizontally but it shouldn't. It's wider than the rest of website.

HTML of footer:

<div class="footer">Atomdev.tk &copy; 2017</div>

CSS of footer:

.footer {
    width:100%;
    position: absolute;
    overflow: hidden;
    left: 0
    bottom: 0;
    width: 100%;
    text-align: center;
    background-color: #222222;
    padding: 30px;
}

Here is my website with this footer: atomdev.tk

Upvotes: 0

Views: 37

Answers (1)

Michael Coker
Michael Coker

Reputation: 53674

You can either...

  • add box-sizing: border-box; to .footer (by default the box model will add any paddings and borders to the calculated width of the element - box-sizing: border-box keeps the width of padding/border within the specified width)

or

  • remove width(s) and add right: 0;

Upvotes: 1

Related Questions