Foros del Web » Creando para Internet » CSS »

Imagen sobrepasa capa

Estas en el tema de Imagen sobrepasa capa en el foro de CSS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 22/03/2007, 15:33
Avatar de El Menda  
Fecha de Ingreso: junio-2001
Ubicación: Jaén
Mensajes: 516
Antigüedad: 16 años, 5 meses
Puntos: 0
Imagen sobrepasa capa

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).
__________________
"No hay mujer fea sino copa de menos"
  #2 (permalink)  
Antiguo 22/03/2007, 17:41
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Re: Imagen sobrepasa capa

podrías colocar todo tu código CSS?
  #3 (permalink)  
Antiguo 22/03/2007, 18:29
Avatar de El Menda  
Fecha de Ingreso: junio-2001
Ubicación: Jaén
Mensajes: 516
Antigüedad: 16 años, 5 meses
Puntos: 0
Re: Imagen sobrepasa capa

Cita:
Iniciado por DragonX Ver Mensaje
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
}
__________________
"No hay mujer fea sino copa de menos"
  #4 (permalink)  
Antiguo 23/03/2007, 06:55
Avatar de floren  
Fecha de Ingreso: febrero-2005
Ubicación: Málaga
Mensajes: 134
Antigüedad: 12 años, 10 meses
Puntos: 0
Re: Imagen sobrepasa capa

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é.
  #5 (permalink)  
Antiguo 23/03/2007, 08:11
Avatar de El Menda  
Fecha de Ingreso: junio-2001
Ubicación: Jaén
Mensajes: 516
Antigüedad: 16 años, 5 meses
Puntos: 0
Re: Imagen sobrepasa capa

Cita:
Iniciado por floren Ver Mensaje
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!
__________________
"No hay mujer fea sino copa de menos"
  #6 (permalink)  
Antiguo 23/03/2007, 08:27
Avatar de floren  
Fecha de Ingreso: febrero-2005
Ubicación: Málaga
Mensajes: 134
Antigüedad: 12 años, 10 meses
Puntos: 0
Re: Imagen sobrepasa capa

Probaste a quitar height: 180px;? Qué sentido tiene esa altura?
  #7 (permalink)  
Antiguo 23/03/2007, 15:19
Avatar de El Menda  
Fecha de Ingreso: junio-2001
Ubicación: Jaén
Mensajes: 516
Antigüedad: 16 años, 5 meses
Puntos: 0
Re: Imagen sobrepasa capa

Cita:
Iniciado por floren Ver Mensaje
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
__________________
"No hay mujer fea sino copa de menos"
  #8 (permalink)  
Antiguo 24/03/2007, 13:05
Avatar de El Menda  
Fecha de Ingreso: junio-2001
Ubicación: Jaén
Mensajes: 516
Antigüedad: 16 años, 5 meses
Puntos: 0
Re: Imagen sobrepasa capa

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

Saludos.
__________________
"No hay mujer fea sino copa de menos"
  #9 (permalink)  
Antiguo 04/09/2009, 04:46
 
Fecha de Ingreso: febrero-2006
Mensajes: 4
Antigüedad: 11 años, 10 meses
Puntos: 0
Respuesta: Imagen sobrepasa capa

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

Cita:
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 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.

Última edición por despistao; 04/09/2009 a las 08:35 Razón: Anotar un apunte
  #10 (permalink)  
Antiguo 04/09/2009, 10:17
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.697
Antigüedad: 8 años, 5 meses
Puntos: 137
Respuesta: Imagen sobrepasa capa

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

ups doble post
  #11 (permalink)  
Antiguo 04/09/2009, 10:19
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.697
Antigüedad: 8 años, 5 meses
Puntos: 137
Respuesta: Imagen sobrepasa capa

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
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 04:46.