Imagen sobrepasa capa

[El Menda]

Hola a todos. Antes de nada dejo la foto con el problema:


Bueno pues eso, tengo lo siguiente de forma resumida (me he inventado la sintaxis, lo sé):

Código HTML:

<div contenedor>
   ......
   ......
   <div cuerpo>
      <div lateral>
      </div lateral>
      <div principal>
         <img="laimagendeabajodeltodo.png" />
      </div principal>
   </div>
   ......
   ......
</div contenedor> 

Entonces, ¿cómo hago para que no sobrepase la imagen el div principal (que es el que es de color blanco?
El CSS creo que no es necesario incluirlo, por eso no lo he hecho.

GRASIAS DE HANTEBRAZO HOYGAN! (colaborando para una escritura mejor, jeje).

[DragonX]

podrías colocar todo tu código CSS?

[El Menda]

Iniciado por DragonX

podrías colocar todo tu código CSS?

Ahí voy:

Código:

#contenedor {
   text-align: left;
	width: 840px;
   margin: auto;
	float: none;
}

#cuerpo {
   margin: 0px 0px 0px 0px;
	background-color: #000;
}

#lateral {
	width: 230px;
	background-color: #C00000;
	color: #fff;
	font-weight: bold;
	float: right;
	padding: 10px;
}

#principal {
  	background-color: #fff;
  	padding: 4px 4px 4px 4px;
  	min-height: 180px;
  	height:auto !important; /* Hack IE */
  	height: 180px;
}

#principal img {
	border: 0px;
	float: left;
	padding-right: 15px
}

[floren]

Prueba con

Código:

#principal {
  	background-color: #fff;
  	padding: 4px 4px 14px 4px;
  	min-height: 180px;
  	height:auto !important; /* Hack IE */
  	height: 180px;
}

Pero si pones un height: 180px; a piñón... no sé.

[El Menda]

Iniciado por floren

Prueba con

Código:

#principal {
  	background-color: #fff;
  	padding: 4px 4px 14px 4px;
  	min-height: 180px;
  	height:auto !important; /* Hack IE */
  	height: 180px;
}

Pero si pones un height: 180px; a piñón... no sé.

Huy casi! He puesto donde tú me has señalado 200 y sí me lo hace correctamente, pero si quito la imagen y dejo ese poco texto me sale un espacio blanco grandísimo. ¿Qué puedo hacer que no sea poner muchos <br />?
Gracias!

[floren]

Probaste a quitar height: 180px;? Qué sentido tiene esa altura?

[El Menda]

Iniciado por floren

Probaste a quitar height: 180px;? Qué sentido tiene esa altura?

No lo he probado quitar porque en teoría es un hack para que se vea bien en el Internet Explorer. Mañana probaré hacerme lo que me dices.

GRASIAS DE HANTEBRASO

[El Menda]

Ya lo he arreglado. Más que del CSS era un problema de diseño. Lo he arreglado creando capas distintas.

Saludos.

[despistao]

Hola, tenía el mismo problema y he dado con la solución, y como no puedo poner enlaces, os la dejo aquí por si alguien más tiene el mismo problema

Debajo de un float tiene que existir un clear, no
en la capa que los contiene, no en la capa que flota. En una capa
contigua que este contenida en la misma que la que se encuentra
flotando.


<div style="...">/*aquí dentro alguien flota :0 */

<div style="float:left;..."></div> /*yo floto*/
<div style="..."></div> /*me dejo llevar*/
<div style="clear:both;..."></div> /*Se acabo la fiesta, aquí no
se flota más*/
<div>

y SÍ es problema del CSS jeje :))

salu2


Nota: En la capa contenedora (la de arriba de todo en el ejemplo) se debe poner position:relative, si no, en Iexplorer no aparecen los bordes o quizá la capa.

[alexk]

despistao en el nick la penitencia jeje... es del 2007 esto jaja ademas es mas simple con esto vale overflow:hidden

ups doble post

[alexk]

despistao en el nick la penitencia jeje... es del 2007 esto jaja ademas es mas simple con esto vale overflow:hidden

ups se envio 2ble