Return to Snippet

Revision: 55912
at February 29, 2012 02:35 by BebenKoben


Initial Code
CSS COded

<style>
.nav {
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAnCAYAAADO4CKiAAAAj0lEQVQImWWMuw3CQBQENyIjoR4KoA9EQEQbRITU4JQ6/JNPfrJ8On/OgekBIQ/JZSSjnWBHWZahdV1RURQoz/O0yrJEVVWhuq5R0zTIOYfatkVmhrquQ33fI+89CiGgYRgSxnFE0zSheZ5RjBEty5I0hJC+Zpby/vVE2+2Avvcj4qI/bNcd+jxO6H3eI4AfnNF/gVl2jIcAAAAASUVORK5CYII=") repeat-x top left;
width: 100%;
height: 40px;
margin: 0 auto;
display: block;
}
.nav .menu {
margin:0 5px;
}
.nav .menu ul {
list-style-type: none;
float: left;
}
.nav .menu li {
display: block;
margin: 0;
}
.nav .menu li a {
height: 38px;
line-height: 28px;
display: block;
float: left;
padding: 0 10px;
font-weight: 700;
font-size:90%; 
}
.nav .menu li a.current {
padding: 0px 10px;
}
.nav .menu li a {
color: #333;
}
.nav .menu li a:hover {
color: #fff;
background: #f60;
height: 38px;
}
.nav .menu li a.current {
color: #fff;
background: #f60;
}
</style>

Markup HTML

<div class="nav">
<ul class="menu">
<li><a class="current" title="" href="#">Current</a></li>
<li><a title="" href="#">Menu 1</a></li>
<li><a title="" href="#">Menu 2</a></li>
<li><a title="" href="#">Menu 3</a></li>
<li><a title="" href="#">Menu...</a></li>
</ul>
</div>

Initial URL

                                

Initial Description
Simple Menu HTML

Initial Title
Very Simple Menu

Initial Tags
html

Initial Language
HTML