Establecer el número de columnas de una lista en CSS

CSS

Las listas en el lenguaje HTML son uno de los elementos más utilizados. Una de las utilidades más comunes que se les suele dar, es la de crear los menús de una web o mostrar listas ordenadas o desordenadas de categorías, post, etc…

Si creamos una lista, con por ejemplo este código:

Esto nos mostrará todos los elementos que incluya cada etiqueta <li> unos debajo de otros hasta que los muestre todos.

 

A continuación, vamos a ver el código que tendríamos que aplicar para que una lista aparezca en 2 o más columnas con un simple código CSS aplicado a la etiqueta <ul>

Con este código en particular, estaríamos dividiendo la lista existente en 3 columnas aunque como es obvio, podemos variar este número para obtener el resultado que necesitemos. Un ejemplo visual de como se mostraría una lista a la que se le aplica el CSS anterior la vemos en esta misma web en la siguiente captura.

Establecer el número de columnas de una lista en CSS
Vota este post
Establecer el número de columnas de una lista en CSS Modificado: enero 30th, 2018 by Jose Manuel Moreno

POST RELACIONADOS


Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *