I just fixed one problem with the footer div I have, and made another one 🙂
Currently, I have the footer broken broken on this page:
http://www.comehike.com/hikes/scheduled_hike.php?hike_id=189
See how the footer goes across the entire page?
Now take a look here:
http://www.comehike.com/earn_money.php
The footer is across the entire page, and also has bigger letters.
Here is the styling for my footer that I think is used by both pages. Although that thinking might be the problem here 🙂
/* styles for footer */
.footer
{
padding: 0.5em 0;
margin: 0 auto;
margin-bottom: 20px;
text-align: center;
vertical-align:center;
background: #fff;
color: #462c1f;
border: 10px solid #fff;
}
.footer a, .footer span {
color: #462c1f;
font-size:85%;
}
.footer a {
color: #7E9940;
font-size:85%;
}
.footer a:hover {
text-decoration: underline;
color: #3f6b30;
}
the second case (which I think is correct) http://www.comehike.com/earn_money.php, has the
.footerinside the.mainBodyThe first case (http://www.comehike.com/hikes/scheduled_hike.php?hike_id=189) is outside!
That’s why it is different.
The problem is not at the CSS (in this case) but more with the where the footer is at the html, which inherits styles from other containers.