/ Published in: HTML
Expand |
Embed | Plain Text
Copy this code and paste it in your HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <style type="text/css" media="screen"> html { background-color: #ccc; } #container { margin-left: auto; margin-right: auto; width: 980px; background-color: #eee; } #footer { background-color: #191816; width: 940px; clear: both; font-size: 1.2em; margin-right: 20px; margin-left: 20px; text-align: center; padding-top: 5px; padding-bottom: 5px; } #footer ul { list-style-type: none; padding: 0; display: -moz-inline-box; /* For FF<3 */ display: inline-block; /* IE <8 needs this tripped back to display: inline; to make it work on block elements - see conditional below */ vertical-align: middle; /* explicitly declare your preference as Moz inline-box auto aligns to top */ margin-left: auto; margin-right: auto; } #footer ul li { float: left; padding-right: 10px; border-right: 1px solid #ccc; padding-left: 10px; } #footer ul li a, #footer ul li a:visited, #footer ul li a:active { color: #fff; } #footer ul li a:hover { color: #fff; } #footer ul li.last { border: none; } </style> <!--[if lt IE 8]> <style type="text/css" media="screen"> #footer ul {display: inline;} /* this is to make inline-block work on block elements versions <IE8 */ #footer ul li {display: inline;} </style> <![endif]--> </head> <body> <div id="container"> <div id="footer"> <ul> </ul> </div> </div> </body> </html>