Picnic Website Code Tutorials

CSS Button

View Demo

The CSS

#nav ul {
list-style: none;
}
#nav li {
margin: 7px 0;
	}
#nav a:link, #nav a:visited {
text-align: center;
text-decoration: none;
display: block;
border: 3px solid;
border-color: #CCC #333 #333 #CCC;
width: 240px;
padding: 5px 0;
background: #999;
color: #000000;
font-weight: bold
}
#nav a:hover {
position: relative;
top: 1px;
left: 1px;
border-color: #333 #CCC #CCC #333;
}
		

The html

<div id="nav">
<ul>
<li><a href="#">Button</a></li>
<li><a href="#">Button</a></li>
<li><a href="#">Button</a></li>
<li><a href="#">Button</a></li>
<li><a href="#">Button</a></li>
</ul>
</div>
		

Sponsors

Top Donators

Friends of Mine