He creado una plantilla con Bootstrap. No consiguo que en Firefox me repete col-md-10
o col-lg-10
y me lo renderiza a todo lo ancho de la página. En cambio el mismo código se ve bien en Chrome, en Opera y en Safari.
Este es el código:
<div class="container-fluid"> <div class="row"> <div class="col-md-10 col-md-offset-1 col-lg-10 col-lg-offset-1" id="cuerpo"> <header class=" col-md-12 col-xs-12 col-sm-12" id="cabecera"> <img class="img-responsive" src= "http://lorempixel.com/870/150/city/" width="120%" height="auto" alt="cabecera"> <div class="contenido"> <h1> Xxxxxxxxxxx</h1> <h3>Laboratorio de anaplatología</h3> </div> </header>
¿Alguna sugerencia? Gracias.
Respuestas
Viendo el código que muestras, creo que Firefox es en realidad el único que está haciéndolo bien. La clase container-fluid
es para que el diseño ocupe toda la anchura disponible. Si no quieres eso, deberías usar container
en vez de container-fluid
.
Después veo algún que otro pequeño problema con los estilos col-*
de #cuerpo
y #cabecera
. En Bootstrap normalmente no se definen las columnas dentro de otras sin que en medio haya un <div class="row">
(tu tienes un .row
por delante de #cuerpo
, pero faltaría otro .row
entre #cuerpo
y #cabecera
).
@javiereguiluz