Elementos de listas LI en la misma línea

Simplemente has de definir el estilo float:left; en el elemento de la lista, así:





<li style="float:left;">Elemento</li>







Aunque luego para que quede bien la lista posiblemente necesites definir otros atributos CSS.







<ul>



<li style="float:left; width:120px; padding-left: 10px;">Elemento 1</li>



<li style="float:left; width:120px; padding-left: 10px;">Elemento 2</li>



<li style="float:left; width:120px; padding-left: 10px;">Otra cosa</li>



<li style="float:left; width:120px; padding-left: 10px;">Esta lista li es de varios elementos por línea</li>



<li style="float:left; width:120px; padding-left: 10px;">Más</li>



<li style="float:left; width:120px; padding-left: 10px;">Lo que sea</li>



</ul>






Tenemos varios artículos con ejemplos de atributos CSS que se pueden aplicar a listas para generar diversos tipos de listas útiles. Explora nuestro taller de CSS para encontrarlos.