This is how I would do it. There are other ways. Just make sure that it is logical and clear to read.
In CSS file
#footer { background: #111; color:#CCC; padding: 1% 0; margin-top:5px; /* for this webpage,cancel the body margins */ margin: 0px -6% -4% -12%; } .centered { display: block; /* the following two lines should probably be deleted */ margin-left: auto; margin-right: auto; text-align: center; }
I'm not sure if .centered
needs all of that stuff in it. Try eliminating some of it and see what happens.
On this page, the <body> tag sets the margins and it's hard to make the footer override it.
In HTML file
<div id="footer" class="centered"> Created by Michael Harwood © 2015. </div>
Nice example of CSS at the top of this page: http://www.w3schools.com/html/html_css.asp