[scl]

Codice:

Codice:

<div id="topbar">
        <ul id="menu">
            <li><a href="http://dev.vincenzolarosa.it/short">Home</a></li>
            <li><a href="http://webmail.vincenzolarosa.it" target="_blank">Mail</a></li>
            <li><a href="http://www.vincenzolarosa.it" target="_blank">News</a></li>
            <li><a href="http://www.twitter.com/enzolarosa" target="_blank">Twitter</a></li>
            <li><a href="http://www.facebook.com/vincenzolarosa.it" target="_blank">Facebook</a></li>
            <li><a href="http://www.vincenzolarosa.it/news" target="_blank">NewsLetter</a></li>
        </ul>
        <?
        if ($login==0){
        ?>
        <!--Utente non registrato -->
        <ul id="menu_dx">
            <li><a href="#">Accedi</a></li>
        </ul>
        <?
        }else{
        ?>
        <!--Utente registrato -->
        <ul id="menu_dx">
            <li><a href="#">Profilo</a></li>        
            <li><a href="#">Messaggi</a></li>
            <li><a href="#">Esci</a></li>
        </ul>
        <?
        }
        ?>
    </div>

CSS:

Codice:

/*zona di sinistra*/
#menu {
    background: #333;
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 70%;
}
#menu li {
    float: left;
    font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
}
#menu a {
    background: #333 url("images/seperator.gif") bottom right no-repeat;
    color: #ccc;
    display: block;
    float: left;
    margin: 0;
    padding: 8px 12px;
    text-decoration: none;
    font-weight:normal;
}
#menu a:hover {
    background: #2580a2 url("images/hover.gif") bottom center no-repeat;
    color: #fff;
    padding-bottom: 8px;
}

/*zona di destra*/
#menu_dx {
    background: #333;
    float: right;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 30%;
}
#menu_dx li {
    float: right;
    font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
}
#menu_dx a {
    background: #333 url("images/seperator.gif") bottom right no-repeat;
    color: #ccc;
    display: block;
    float: right;
    margin: 0;
    padding: 8px 12px;
    text-decoration: none;
    font-weight:normal;
}
#menu_dx a:hover {
    background: #2580a2 url("images/hover.gif") bottom center no-repeat;
    color: #fff;
    padding-bottom: 8px;
}

/*Top Bar*/
#topbar{
    position:fixed !important;
    top:0px;
    left:0px;
    height:30px;
    width: 100%;
    background:#333;
    border-style:groove;
    border-width:1px;
}


#container{
    display:block;
    position: relative;
    margin:0 auto;
    text-align:left;
    
}

Fonte: http://www.vincenzolarosa.it/2845-top-ba...oogle.html

[Zarta]

Carino, peccato che in alcuni selettori css vengano richiamate immagini con un link relativo, ma le immagini non ci sono ne qui ne sul blog della fonte XD Comunque non sono difficili da creare, può tornare utile

[tuiopmio]

grz!!! utile!