Personalizar el primer <li>

[juandedios]

Hola, estoy haciendo un menú horizontal el <li> está así:

Código CSS:

ul#boxnav li {
    margin: 0;
    padding-left: 30px;
    padding-right: 30px;
    border-left: 1px #FFF solid;
    color: #FFF;
    float: left;
}
 

Sale bien pero el border-left que pongo también se ve en el primer <li> y ahi no quiero que vaya, buscando en la net vi que se podía poner así:

Código CSS:

ul#boxnav li.first {
    margin: 0;
    padding-left: 30px;
    padding-right: 30px;
    border-left: none;
    color: #FFF;
    float: left;
}
 

De esta forma no saldría el border-left en el primer <li>, pero me digue saliendo. quizas estoy haciendo algo mal.

Espero que me puedan ayudar.