Use CSS To Center a Footer
I came across a version of the below CSS today and found it to be a simpler and more elegant solution than the multiple <div> tag approach I was currently using to center footer links.
The final rendered html should appear as follows:
Item One | Item Two | Item Three | Item Four | Item Five
<html>
<head>
<style type="text/css">
.footer {margin:1em 0em 0em 0em; padding:0em;text-align:center; list-style:none;}
.footer li {display:inline; border-left:1px solid #000; padding:0em .3em 0em .5em;}
.footer li.first {border-left:none;}
</style>
</head>
<body>
<ul class="footer">
<li class="first"><a href=#">Item One</a></li>
<li><a href="#">Item Two</a></li>
<li><a href="#">Item Three</a></li>
<li><a href="#">Item Four</a></li>
<li class="last"><a href="#">Item Five</a></li>
</ul>
</body>
</html>
