Ayuda con DIV

[javiertkd]

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

[locoxchacho]

agrega a #productosmenu:

overflow:auto;

Creo que eso te solucionara tu problema.

Un saludo,

Pablo.

[javiertkd]

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

[willyfc]

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

[javiertkd]

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

Algun otro consejo para solucionarlo.

[willyfc]

por que no pones el codigo que esta manejando todo tu contenido y el pie para que veamos bien que pasa

[javiertkd]

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

[jomaruro]

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.

[javiertkd]

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.

[talmente]

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;

[javiertkd]

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

[talmente]

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.

[Dalvenjha]

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;
}