centrare nav

[4l3_97]

Ciao a tutti!
Ho guardato un bel po' in giro, ma non ho trovato niente che fa al caso mio...
In poche parole, vorrei centrare un nav, ma non capisco come fare,
Ecco il codice HTML e CSS.

<nav>
    <ul>
        <li><a href="#" id="selected" title="">Home</a></li>
        <li><a href="#" title="About Me">About Me</a></li>
        <li><a href="#" title="Contact Me">Contact Me</a></li>
        <li><a href="#" title="Other Stuff">Other Stuff</a></li>
    </ul>
</nav>

nav {
    position: absolute;
    margin-left: 27%;
}


nav ul {
    list-style: none;
    margin: 0px;
}


nav ul li {
    float: left;
    margin-right: 20px;
    text-align: center;
    width: 130px;
    border-width: 0px 6px 6px 6px;
    border-color: #f00;
}


nav ul li a {
    padding: 20px 15px 10px 15px;
    color: #fff;
    text-decoration: none;
    background-color: #3083f0;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}


nav ul li a:hover, a:active {
    background-color: #1c1ceb;
    padding-top: 30px;
}


#selected {
    background-color: #1c1ceb;
    padding-top: 30px;
}

​
Potreste aiutarmi?

Ah, già che ci sono chiedo anche questa cosa: Volevo fare in modo che ci fosse un contorno sulle etichette, ma provando border-width e border-color non ottengo niente!

Ciao e grazie ancora

[Prill]

via il posizionamento assoluto, poi, dato che hai dimensioni precise per le voci elenco, aggiungi una larghezza su nav (130+margini+bordi moltiplicato per 4 che sono le tue li) e setta i margini sinistro e destro su auto.
Quanto al secondo problema: dovresti anche specificare il border-style. Puoi comunque semplificare usando una forma abbreviata per tutti i bordi e poi rimuovere quello superiore:

border:6px solid #f00;
border-top:0