Height auto no funciona
Publicado por anonymous (3 intervenciones) el 11/01/2017 12:42:24
Buenas tardes, estoy teniendo un pequeño problema a la hora de mostrar unas imágenes responsive.
El caso es el siguiente:
HTML->
CSS ->
El problema viene que por mucho que le ponga u height 100% o auto, el Div no lo pilla. En cambio si le pongo un height:150px sí que muestran las imágenes. El problema viene que el height dependiendo de la resolución variaría, por lo que:
O lo controlo con @media o no sé en qué fallo para hacerlo automáticamente...
Gracias por la ayuda!
El caso es el siguiente:
HTML->
1
2
3
4
5
6
<div class="row" style="width:100%;margin-left:0px;margin-right:0px;">
<div class="col-md-3 col-sm-6 col-xs-6 banner-home" id="te-blanco""><a href="#" class="enlaces-te"></div>
<div class="col-md-3 col-sm-6 col-xs-6 banner-home" id="te-verde"><a href="#" class="enlaces-te"></div>
<div class="col-md-3 col-sm-6 col-xs-6 banner-home" id="te-azul"><a href="#" class="enlaces-te"></div>
<div class="col-md-3 col-sm-6 col-xs-6 banner-home" id="te-negro"><a href="#" class="enlaces-te"></a></div>
</div>
CSS ->
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
.banner-home{
background-position:center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
height: 100%;
width: 100% ;
text-align: center;
display:block;position:relative;}.enlaces-te{display:block;width:100%;height:100%;}
#te-blanco{background:url("/media/images/Te-Blanco.jpg") no-repeat;}
#te-verde{background:url("/media/images/Te-Verde.jpg") no-repeat;}
#te-azul{background:url("/media/images/Te-Azul.jpg") no-repeat;}
#te-negro{background:url("/media/images/Te-Negro.jpg") no-repeat;}El problema viene que por mucho que le ponga u height 100% o auto, el Div no lo pilla. En cambio si le pongo un height:150px sí que muestran las imágenes. El problema viene que el height dependiendo de la resolución variaría, por lo que:
O lo controlo con @media o no sé en qué fallo para hacerlo automáticamente...
Gracias por la ayuda!
Valora esta pregunta
0
