Hola,
Tengo una página web hecha con bootstrap 3, mi grid es el siguiente:
<div class="row"> <div class="col-md-2"> Aquí tengo un menú vertical que se colapsa cuando cambio la resolución </div> <div class="col-md-10"> Aquí tengo una tabla html </div> </div>
El problema que tengo, es que la web se tiene que ver en 1024, y en está resolución, el menú vertical se sitúa encima de la tabla, y lo que yo necesito es que permanezca a las izquierda de la pantalla y la tabla a la derecha.
¿Me podrían echar un cable?
Gracias,
Respuestas
La solución sería cambiar las clases col-md-* por col-sm-* de esta manera:
<div class="row"> <div class="col-sm-2"> Aquí tengo un menú vertical que se colapsa cuando cambio la resolución </div> <div class="col-sm-10"> Aquí tengo una tabla html </div> </div>
La clase sm dice cómo se ve el diseño en dispositivos con poca resolución y en tu diseño original utilizabas la clase md, que dice cómo se ve en dispositivos medianos. Si quieres, puedes incluso hacer un poco más grande el menú izquierdo en los dispositivos pequeños y mantenerlo en los medianos. Se haría así:
<div class="row"> <div class="col-sm-3 col-md-2"> Aquí tengo un menú vertical que se colapsa cuando cambio la resolución </div> <div class="col-sm-9 col-md-10"> Aquí tengo una tabla html </div> </div>
@javiereguiluz
Genial, ya está resuelto, que rápido :)
@eladerezador