Thursday, September 7, 2017

CSS: Fixed Header and Footer


footer{
background: #666666;
color: #B2D1D1;
font-weight: bold;
position: fixed;
Width: 100%;
text-align: center;
bottom: 0;
height: 2em;
padding-top: 2em;
}

header{
background: #666666;
color: #B2D1D1;
font-weight: bold;
font-family: voxBOX;
text-align: center;
font-size: 1em;
top: 0;
position: fixed;
Width: 100%;
height: 3em;
padding-top: 1em;
z-index: 1;
box-shadow: 0px 3px 7px #000000;  <--Just to put shadows on your header. Try it! It's cool :)
}

Sample Ouput:
Look at the scrollbar, header and footer didn't moved. :)

No comments:

Post a Comment