Como eliminar espacio de la izquieda de un <li>?

[mpozo]

Acostumbrate a usar flex

Código CSS:

ul {
    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    border: 1px solid rgb(138, 129, 129);
}
 
li {
    height: 2rem;
    line-height: 2rem;
    padding: 0 1rem;
    text-align: center;
    background: rgb(255, 0, 0);
}
 

Código HTML:

<nav>
    <ul>
        <li>Opción 1</li>
        <li>Opción 2</li>
        <li>Opción 3</li>
        <li>Opción 4</li>
        <li>Opción 5</li>
        <li>Opción 6</li>
        <li>Opción 7</li>
        <li>Opción 8</li>
        <li>Opción 9</li>
    </ul>
</nav>
 

Añade o elimina opciones y verás que se adapta. Claro, se adapta hasta un limite si el número de opciones es excesiva para el padding que se le ha dado