In Action

Simple CSS Menu

Example of a simple CSS menu using the html list tag and a little CSS.


CSS Code

CSS Code for Simple Menu               


<style type="text/css">
	width: 100%;
	background-color: #000080; 
.tmnu ul
	margin: 0; 
  padding: 1px;  
	float: left;		
.tmnu ul li
	display: inline;
.tmnu ul li a
  font-family: Arial,Times New Roman; 
  font-size: .75em;
	float: left; 
  text-decoration: none;
	color: white; /*text color*/
	padding-top: 1px;
  padding-bottom: 1px;
	padding-left: 14px;
  padding-right: 14px;  
	background-color: #000080; 
.tmnu ul li a:visited
	color: white;
.tmnu ul li a:hover, .menu ul li .current
	color: #000000;
	background-color: #e0eeee;


HTML Code for Simple Menu               

<div class="tmnu">
<li><a href="#nada">One</a></li>
<li><a href="#nada">Two</a></li>
<li><a href="#nada">Three</a></li>