HTML CSS examples for CSS Widget:Footer
Navigation on footer
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> #footer2 {<!--from ww w.j a va 2s . c o m--> background-color:Chartreuse; width:981px; height:201px; clear:both; display:block; text-align:center; color:yellow; font-size:small; padding-top:11px; } #footer2 ul { text-align:left; height:auto; margin:0px; float:left; } #footer2 ul li { list-style:none; padding:6px; } #footer2 ul li a { text-decoration:none; color:blue; padding:0px 9px 9px 9px; } #footer2 ul li a:hover { text-decoration:underline; font-weight:901; } </style> </head> <body> <div id="footer2" class="bottomleft bottomright"> <ul> <li>Lorem</li> <li> <a href="">Lorem ipsum dolor sit </a> </li> <li> <a href="#">Lorem ipsu</a> </li> <li> <a href="#">Lorem ipsum dolor sit ame</a> </li> <li> <a href="#">Lorem ipsum dolor sit </a> </li> </ul> <ul> <li> <a href="">Lorem</a> </li> <li>L</li> <li>L</li> <li>L</li> <li>L</li> <li>L</li> </ul> <ul> <li>Lorem</li> <li> <a href="">Lorem ipsum dolor sit </a> </li> <li> <a href="#">Lorem ipsu</a> </li> <li> <a href="#">Lorem ipsum dolor sit ame</a> </li> <li> <a href="#">Lorem ipsum dolor sit </a> </li> </ul> <ul> <li>Lorem</li> <li> <a href="">Lorem ipsum dolor sit </a> </li> <li> <a href="#">Lorem ipsu</a> </li> <li> <a href="#">Lorem ipsum dolor sit ame</a> </li> <li> <a href="#">Lorem ipsum dolor sit </a> </li> </ul> </div> <!--end footer2--> <div id="footer3"> <br>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ullamcorp <br> <br>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ullamcorper molestie lacus sed fermentum. Aliquam erat volutpat. Vestibulum tortor n <br> <br> </div> <!--end footer3--> <!--end container--> </body> </html>