¿Alguien tiene idea como definir el ancho de las columnas de Bootstrap? Estoy intentando que una columna tenga un ancho que necesito pero no coincide con ninguno de los predefinidos (tiene que estar entre 1 y 12, y necesitaría que quede en algo así como 3,5), ¿cuál es la manera correcta de hacer esto? Pense en agregarle una clase y modificar el ancho al css pero deja de ser responsive.
Respuestas
La única manera correcta de configurar la anchura de las columnas de Bootstrap 3 es la que se explica en la sección Personalizando Bootstrap 3 del manual oficial. Básicamente consiste en bajarse el código LESS o SASS de Bootstrap, cambiar el valor de unas variables y compilar el resultado para obtener el archivo CSS que utilizas en tus sitios web.
Si lo anterior te parece demasiado complicado, puedes utilizar el configurador online de Bootstrap para cambiar esos valores y conseguir el archivo resultante compilado simplemente presionando un botón. Como hay millones de opciones, te indico que los valores que te interesan son @grid-columns
(número de columnas, que por defecto son 12
) y @grid-gutter-width
(separación entre columnas, que por defecto es 30px
).
Una última opción, que es la más sencilla de hacer pero la más peligrosa, sería cambiar a mano directamente en tu archivo CSS la anchura de las columnas de Bootstrap. Esto sólo funciona si mantienes el número de columnas en 12 y, como tú mismo decías, si también aplicas los cambios en los estilos responsive.
Al margen de todo lo anterior, me gustaría decirte que salvo casos muy puntuales en los que sí que estaría justificado hacerlo, te recomiendo que no cambies la anchura de las columnas Bootstrap. El motivo es que a largo plazo esto te va a causar muchos problemas de mantenimiento.
@javiereguiluz
si necesitas que use un espacio de 3,5 columnas puedes hacer un regla de 3
8 columnas a un lado 4 al otro, subdivides las 4 columnas en 12 nuevas
col-10 seria un aprox a 3.5 pero te dejaría un margen de col-2 dentro de 4
@iqudoblev