Archivo de junio de 2014

CSS – Centrar Botones sin Anchura Fija

Publicado por Iván Gajate el 16 de junio de 2014 en css, Desarrollo Web | 1 comentario »

Una cosa muy común es querer centrar los botones de un menú en horizontal sin conocer sus dimensiones.
inline-block al rescate!! 😀
Inline block hace que los elementos se comporten como bloques de texto en línea, y por lo tanto se colocan en horizontal uno a la derecha del otro, y al centrar el contenedor, se centran los botones 🙂

http://jsfiddle.net/yporqueno/dYLxN/

<ul class="botonera">
    <li>Sección 1</li>
    <li>Sección 2</li>
    <li>Sección 3</li>
    <li>Sección 4</li>
</ul>
.botonera {
    text-align: center;
}
 
.botonera>li {
    display: inline-block;
}

Gracias Javi!! 😀