Posted By

KF on 09/11/09

Tagged

Versions (?)

Last Edited at 09/11/09 11:03am

Statistics

Viewed 632 times

Favorited by 2 user(s)

Related snippets

basic Horizontal Nav

/ Published in: HTML

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

<ul id="nav">
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
</ul>
 
#nav { width: 100%; float: left; margin: 0 0 3em 0; padding: 0; list-style: none; }
#nav li { float: left; }
#nav {
        width: 100%;
        float: left;
        margin: 0 0 3em 0;
        padding: 0;
        list-style: none;
        background-color: #f2f2f2;
        border-bottom: 1px solid #ccc;
        border-top: 1px solid #ccc; 
}
 
#nav li a {
           display: block;
           padding: 8px 15px;
           text-decoration: none;
           font-weight: bold;
           color: #069;
           border-right: 1px solid #ccc; 
}
 
#nav li a:hover {
                color: #c00;
                background-color: #fff; 
}
 
#nav {
        width: 100%;
        float: left;
        margin: 0 0 3em 0;
        padding: 0;
        list-style: none;
        background-color: #f2f2f2;
        border-bottom: 1px solid #ccc;
        border-top: 1px solid #ccc; 
}
#nav li { float: left; }
#nav li a {
        display: block;
        padding: 8px 15px;
        text-decoration: none;
        font-weight: bold;
        color: #069;
        border-right: 1px solid #ccc; 
}
#nav li a:hover { color: #c00; background-color: #fff; }