Foros del Web » Creando para Internet » CSS »

Ayuda con DIV

Estas en el tema de Ayuda con DIV en el foro de CSS en Foros del Web. Hola, manejo poco de CSS y el problema que me surgue es simple, al menos a mi parecer. Tengo un div con contenido dinamico, y ...
  #1 (permalink)  
Antiguo 02/02/2009, 09:04
Avatar de javiertkd  
Fecha de Ingreso: agosto-2008
Ubicación: Mendoza
Mensajes: 129
Antigüedad: 9 años, 3 meses
Puntos: 1
Ayuda con DIV

Hola, manejo poco de CSS y el problema que me surgue es simple, al menos a mi parecer. Tengo un div con contenido dinamico, y quiero que se expanda en forma vertical de acuerdo al contenido que posea (tamaño).

Lo que me ocurre es que el contenido se muestra pero el div no se expande, esto lo comprovee dandole un color al fondo, y el pie de pagina que esta la final se queda en medio del texto dinamico a mostrar, y claro se ve horrible

#productosmenu {
width: 850px;
float: left;
}

Les doy la gracias por la ayuda
  #2 (permalink)  
Antiguo 02/02/2009, 09:17
 
Fecha de Ingreso: septiembre-2008
Ubicación: Nuñez, Capital Federal
Mensajes: 423
Antigüedad: 9 años, 3 meses
Puntos: 1
Respuesta: Ayuda con DIV

agrega a #productosmenu:

overflow:auto;

Creo que eso te solucionara tu problema.

Un saludo,

Pablo.
  #3 (permalink)  
Antiguo 02/02/2009, 09:32
Avatar de javiertkd  
Fecha de Ingreso: agosto-2008
Ubicación: Mendoza
Mensajes: 129
Antigüedad: 9 años, 3 meses
Puntos: 1
Respuesta: Ayuda con DIV

Soluciona el problema, pero me aparece la barra para desplazar el contenido y no quiero que eso ocurra.. Solo que se expanda a lo largo, si que aparesca la barra. Es decir que no este defino height: y este se alargue de acuerdo al contenido que poseea
  #4 (permalink)  
Antiguo 02/02/2009, 09:47
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: Ayuda con DIV

entonces trata don display:table en el div del texto que se muestra, pero verifica IE6 por que algunas veces tiene problemas con eso

si el pie se sube es por que tienes elementos flotantes; creo, coloca clear:both al pie y veamos
__________________
WFC
codigo82
  #5 (permalink)  
Antiguo 02/02/2009, 13:40
Avatar de javiertkd  
Fecha de Ingreso: agosto-2008
Ubicación: Mendoza
Mensajes: 129
Antigüedad: 9 años, 3 meses
Puntos: 1
Respuesta: Ayuda con DIV

provee, pero no expande le div, estoy usando IE7 y firefox.

Algun otro consejo para solucionarlo.
  #6 (permalink)  
Antiguo 02/02/2009, 13:49
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: Ayuda con DIV

por que no pones el codigo que esta manejando todo tu contenido y el pie para que veamos bien que pasa
__________________
WFC
codigo82
  #7 (permalink)  
Antiguo 02/02/2009, 14:35
Avatar de javiertkd  
Fecha de Ingreso: agosto-2008
Ubicación: Mendoza
Mensajes: 129
Antigüedad: 9 años, 3 meses
Puntos: 1
Respuesta: Ayuda con DIV

body {
margin: 0px;
background-image: url(../img/back.gif);
background-repeat: repeat-x;

}

#productosmenu {
width: 850px;
float: left;
}
#cuerpoproductos_pag img {
margin-right: 15px;
margin-bottom: 20px;
margin-top: 4px;
}

#pie {
width: 850px;
height: 30px;
padding-top: 15px;
background-color: #EBEBEB;
float: left;
border-bottom: 5px #CCCCCC solid;
text-align: center;
}

/////// si estan los div en el codigo dinamico

<div id="contenedorprod">
<div id="productosmenu">
<div id="cuerpoproductos_pag">
<?php contenido dinamico ?>
</div>
</div>
</div>
<div><?php include ("pie.php") ?></div>

La primera parte es el codigo del CSS, y la segunda es como esta acomodado los div.

Gracias por la ayuda, que me brindan
  #8 (permalink)  
Antiguo 02/02/2009, 16:24
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Ayuda con DIV

Hola:

Para que el pie te salga debajo de todo tienes que hacer esto:

en el CSS añadir:

#reset{clear:both;}

y en el HTML añadir:

<div id="contenedorprod">
<div id="productosmenu">
<div id="cuerpoproductos_pag">
<?php contenido dinamico ?>
</div>
</div>
<div id="reset"></div>
</div>
<div><?php include ("pie.php") ?></div>

Saludos.

  #9 (permalink)  
Antiguo 03/02/2009, 07:33
Avatar de javiertkd  
Fecha de Ingreso: agosto-2008
Ubicación: Mendoza
Mensajes: 129
Antigüedad: 9 años, 3 meses
Puntos: 1
Respuesta: Ayuda con DIV

coloque el codigo , pero me subio mas arriba el pie de pagina, que puedo hacer o que esta mal en el CSS ????

Y he agregado mas texto y ocurre, que el div tine definido un limite a lo largo, porque el texto se coloca en el lado izq de la web, la verdad que el codigo CSS no es mio yo solo programo en php y nose como resolver esto.

Cuando he utilizado div antes en otros trabajos esto se expanden sin nigun problema, pero aqui nose que causa que esto no ocurra.

Última edición por javiertkd; 03/02/2009 a las 07:45
  #10 (permalink)  
Antiguo 03/02/2009, 12:07
Avatar de talmente  
Fecha de Ingreso: noviembre-2007
Mensajes: 233
Antigüedad: 10 años, 1 mes
Puntos: 4
Respuesta: Ayuda con DIV

En este codigo no hay ningun div que se identifique como pie:

Código:
<div id="contenedorprod">
<div id="productosmenu">
<div id="cuerpoproductos_pag">
<?php contenido dinamico ?>
</div>
</div>
</div>
<div><?php include ("pie.php") ?></div> 
identificalo como #pie y añade a sus propiedades clear: both;
  #11 (permalink)  
Antiguo 04/02/2009, 06:36
Avatar de javiertkd  
Fecha de Ingreso: agosto-2008
Ubicación: Mendoza
Mensajes: 129
Antigüedad: 9 años, 3 meses
Puntos: 1
Respuesta: Ayuda con DIV

Hola coloque , el div identificado como pie, si bien bajo un poco mas aun sale sobre el texto, parece como si alguno de los demas div tiene un tamaño limitado para expandirse, los revise y no tiene definido el height.

Asi que como no se cual es el problema en si, coloque un tabla al final y dentro de ella el div, con el pie de pagina y usando sus consejos del codigo, logre que funcione . Gracias a todos por la ayuda que me dieron, les dejo un saludo
  #12 (permalink)  
Antiguo 04/02/2009, 07:27
Avatar de talmente  
Fecha de Ingreso: noviembre-2007
Mensajes: 233
Antigüedad: 10 años, 1 mes
Puntos: 4
Respuesta: Ayuda con DIV

perdona que insista este es tu codigo css:
Código:
body {
margin: 0px;
background-image: url(../img/back.gif);
background-repeat: repeat-x;

}

#productosmenu {
	width: 850px;
	float: left;
}
#cuerpoproductos_pag img {
margin-right: 15px;
margin-bottom: 20px;
margin-top: 4px;
}

#pie {
	width: 850px;
	height: 30px;
	padding-top: 15px;
	background-color: #006666;
	float: left;
	border-bottom: 5px #CCCCCC solid;
	text-align: center;
	clear: both;
}
y este es tu codigo html sin el php, yo he puesto dos etiquetas <p>

Código:
<div id="contenedorprod">
<div id="productosmenu">
<div id="cuerpoproductos_pag">
<p></p>
<p></p>
</div>
</div>
</div>
<div id="pie"></div>
rellena las etiquetas de parrafo de texto y veras que tu pie se queda abajo.

tiene que haber algo que te lo JD todo.
  #13 (permalink)  
Antiguo 04/02/2009, 08:48
Avatar de Dalvenjha  
Fecha de Ingreso: febrero-2008
Ubicación: $("#oficina");
Mensajes: 692
Antigüedad: 9 años, 9 meses
Puntos: 53
Respuesta: Ayuda con DIV

Pero esta pregunta se ha hecho miles de veces :th, veamos, lo único que deberías hacer es lo sgte:

Código:
#productosmenu {
	width: 850px;
	float: left;
min-height:100px;
overflow:hidden;
}
Aso crece y no hace falta poner el clear:both. Además debes darle ese estilo a los divs que tienes ahí, pero no pones nada sobre el div que supuestamente está funcionando como contenedor, no sería más fácil que nos pongas TODO tu código? a veces el problema está donde menos lo piensas.

Lo de min-height y overflow-hidden se lo debes poner al contenedor, y a los otros dos divs. Además para IE6 debes agregar el hack de CSS del asterisco.

Código:
*html #productosmenu {
	width: 850px;
	float: left;
height:100px;
overflow:visible;
}
__________________
Mi Showcase ||

Compartiendo todo lo posible con los demás.
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 18:01.