Foros del Web » Creando para Internet » CSS »

¿Cómo puedo arreglar esto?, me tiene loco!!

Estas en el tema de ¿Cómo puedo arreglar esto?, me tiene loco!! en el foro de CSS en Foros del Web. Hola, ante todo gracias por ayudar, me vuelvo loco cada vez que me pasa esto: ¿Cómo puedo hacer que no se desplace ese div?, el ...
  #1 (permalink)  
Antiguo 14/01/2011, 11:36
Avatar de pempas  
Fecha de Ingreso: diciembre-2003
Ubicación: Barcelona
Mensajes: 985
Antigüedad: 14 años
Puntos: 6
¿Cómo puedo arreglar esto?, me tiene loco!!

Hola,
ante todo gracias por ayudar, me vuelvo loco cada vez que me pasa esto:



¿Cómo puedo hacer que no se desplace ese div?, el css es este:

Código PHP:
.prod_box{
width:173px;
height:auto;
float:left;
padding:10px 10px 10px 11px;
}
.
top_prod_box{
width:173px;height:12px;background:url(images/product_box_top.gifno-repeat center bottom;float:leftpadding:0pxmargin:0px;
}
.
bottom_prod_box{
width:173px;height:10px;background:url(images/product_box_bottom.gifno-repeat center top;float:left;padding:0pxmargin:0px;
}
.
center_prod_box{
width:173px;heightauto;background:url(images/product_box_center.gifrepeat-y;float:lefttext-align:center;padding:0pxmargin:0px;
}
.
prod_details_tab{
width:173px;
height:31px;
float:left;
background:url(images/products_details_bg.gifno-repeat center;
margin:3px 0 0 0;
}
img.left_bt{
float:left;
padding:6px 0 0 6px;
}
a.prod_details{
width:25px;
display:block;
float:left;
background:url(images/square-blue-add.gifno-repeat left;
padding:0 0 0 20px;
margin:7px 0 0 38px;
_margin:6px 0 0 35px;
text-decoration:none;
color:#0fa0dd;

Lo cierto es que no sé como resolverlo y me pasa mucho... he probado con clear, con word-break, de todo... nada funciona!

Gracias a todo el mundo!
  #2 (permalink)  
Antiguo 14/01/2011, 18:33
 
Fecha de Ingreso: marzo-2010
Mensajes: 9
Antigüedad: 7 años, 8 meses
Puntos: 0
Respuesta: ¿Cómo puedo arreglar esto?, me tiene loco!!

Es por la doble linea del texto, si el titulo "Articulo prueba de importacion prueba.com" fuera en una sola linea como las dos que la siguen no se descuadraría. Prueba con reducir el tamaño de la letra con el fin que te alcanze en una sola linea
  #3 (permalink)  
Antiguo 14/01/2011, 22:10
 
Fecha de Ingreso: noviembre-2009
Ubicación: Colombía
Mensajes: 311
Antigüedad: 8 años
Puntos: 17
Respuesta: ¿Cómo puedo arreglar esto?, me tiene loco!!

Para tener filas equilibradas yo haría lo siguiente, HTML:

Cita:
<div id="filaEquilibrada">
<div id="item"></div>
<div id="item"></div>
<div id="item"></div>
</div>
CSS:

Cita:
#filaEquilibrada{overflow:hidden; margin:10px 0;}
#filaEquilibrada #item{width:200px; height:auto; float:left; margin:0 5px;}
Modifica valores como creas necesario!

Saludos!
  #4 (permalink)  
Antiguo 16/01/2011, 07:00
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 6 años, 11 meses
Puntos: 36
Respuesta: ¿Cómo puedo arreglar esto?, me tiene loco!!

Otra posibilidad es combinar posicionamiento absoluto y relativo. El contenedor tendría un alto y ancho fijos.
Colocaríamos la imagen por detrás del texto y los textos por encima. De esta manera si el texto sobrepasa el alto previsto se mostraría por encima de la imagen sin desplazarla.
  #5 (permalink)  
Antiguo 16/01/2011, 14:46
 
Fecha de Ingreso: octubre-2006
Mensajes: 562
Antigüedad: 11 años, 2 meses
Puntos: 12
Respuesta: ¿Cómo puedo arreglar esto?, me tiene loco!!

o dale un max-height a la capa, o coloca un <div style="clear: both"></div> entre cada fila.

Etiquetas: arreglar, loco
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 14:09.