Menú horizontal: elementos de lista con margen variable

Menú horizontal: elementos de lista con margen variable

Normalmente, al crear un menú horizontal, emplearemos una lista. Si queremos que los elementos de nuestra lista estén separados entre sí a una distancia variable, bastará con añadir estas dos clases al elemento ul.

display: flex;
justify-content: space-between;

Ejemplo básico de cómo quedarían los estilos para nuestro menú horizontal:

nav ul {
margin: 0;
padding: 0;
display: flex;
justify-content: space-between;
}
nav li {
display: inline;
}

Puedes descargar el ejemplo en HTML haciendo clic en el siguiente enlace: Descargar ejemplo

Publicar un comentario

0 Comentarios