Search code examples
csspositionfooter

footer different section heights

So i'm doing this project and i'm stuck with the footer. I am having this problem where the second section of the footer gets bigger and goes out of the footer. Another thing is when I do float:left; on the third section of the footer, footer's background goes away. So my question is, how do I contain everything within the footer. Here's the codepen - https://codepen.io/anon/pen/gxjbyg .

If I do this:

footer {
background: rgba(0,0,0,0.15);
clear: both;
position:absolute;
width:100%;
bottom:0;
}

It kinda gets fixed, but i'm wondering if there is another way, while not using the absolute positioning.

Solution

  • That's what you expect?

    footer {
 background: rgba(0,0,0,0.15);
 clear: both;
 display: table;
 width: 100%;
}