Bootstrap: Tamaño de columna entre -sm y -xs

No es la primera vez que me pasa. Maquetando un portal responsive con contenido modular he notado que necesitaba un tamaño intermedio entre el pequeño (sm – 768px) y el muy pequeño (xs – 480px).

La situación es esta: en XS normalmente el contenido se mostrará en una columna, pero SM es demasiado grande para mostrar sólo una, así que muestra 2. El problema es que el salto de SM a XS se hace a los 768px y es demasiado grande para empezar a mostrar una sóla columna.

Precisamente hoy el equipo de Bootstrap preguntaba qué nos gustaría ver su próxima versión y les he sugerido este tamaño intermedio.

Luego me he puesto a buscar, y he visto que no era sólo cosa mía y que más gente necesitaba este tamaño de columna. Incluso tiene nombre: MS. Resulta que es un tamaño ya propuesto, bastante debatido y que finalmente se ha rechazado.

Para usarlo sólo hay que agregar el archivo css que han preparado, e incluirlo en el html mediante <link> o en el css con @import.


[bs_button size=»lg» type=»primary» value=»Descargar bootstrap_ms.css» href=»https://gist.github.com/firepol/7942411″]

El uso sería el mísmo que siempre, por ejemplo:

<div class="row">
   <div class="col-lg-4 col-md-4 col-sm-6 col-ms-6 col-xs-12">
   ...
   </div>
</div>

Comentarios (0)

No hay comentarios. Sé el primero en comentar.

Deja una respuesta

Tu dirección de correo electrónico no será publicada.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.