Hola a todos. No doy con ello. A ver si alguno me dice algo porque ya estoy bloqueado.
Porque se ve la franja azul que hay por debajo de la imagen roja?:
Código HTML:
<!doctype html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>prueba</title>
<style>
#contenedor_temas_sinpadding{
border-top:1px solid black;
border-bottom:1px solid black;
height: auto;
overflow: hidden;
}
.img_left{
width: 60%;
float: left;
height: 100%;
background-color: blue;
}
.acordeones{
width: 100%;
background-color: red;
}
</style>
</head>
<body>
<div id="contenedor_temas_sinpadding">
<div class="img_left">
<img class="acordeones" src="prueba.jpg">
</div>
</div>
</body>
</html> No lo entiendo. Os he puesto un ejemplo muy básico del problema que estoy teniendo. Pero aqui se ve igualmente. En realidad lo que veis de rojo es una imagen que va metida dentro de un div y este a la vez dentro de otro. Mas o menos como ahora.
Pero no entiendo que si le he puesto al div img_left, un height de 100%, no se adapte. ¿no se porque no se adapta al 100% de altura?
alguien puede darme un poco de luz en esta tontería en la que estoy metido.
gracias