divs que no se pasen a llevar

edudw · #1 (**permalink**) 23/05/2005, 21:38

Bueno, no sabia como ponerle al titulo, pero el asunto es que no se que propiedad se le debe poner a un div para que al insertar texto en el este se agrande y no pase encima de los otros divs vecinos.

desde ya gracias

kemie · #2 (**permalink**) 24/05/2005, 03:15

se agrande hacia los lados? hacia abajo?
divs posicionados absolutamente? flotados?
seria mas facil entenderte si pone suna pagina de ejemplo...

edudw · #3 (**permalink**) 25/05/2005, 15:34

Hola Kemie.
Sí, tienes razon mi consulta fue muy vaga. Lo que he hecho es 2 divs; superior e inferior. Lo que pretendo es que el div superior mida siempre por defecto 500 de ancho y 200 de alto, el asunto es que en ocasiones pòr tamaño del texto este div superior tendra texto e imagenes y lo que quiero es que se agrande hacia abajo sin pasar por encima de los Divs inferiores, en este caso puntual el Div Inferior.

Aca pego el codigo para mas claridad:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>probando capas</title>
<link href="/pruebas/pruebas.css" rel="stylesheet" type="text/css" />
</head>

<body>

<div id="superior" style="position:absolute; left:11px; top:20px; width:529px; height:200px; z-index:1; background-color: #999966; layer-background-color: #999966; border: 1px none #000000;">este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, </div>
<div id="inferior" style="position:absolute; left:9px; top:240px; width:530px; height:160px; z-index:2; background-color: #99CCFF; layer-background-color: #99CCFF; border: 1px none #000000;"></div>
</body>
</html>

Bueno, desde ya gracias por cualquier ayuda.

atte.

damianx · #4 (**permalink**) 25/05/2005, 21:30

Hola edudw, te aconsejo que intentes hacerlo sin usar posiciones absolutas, ya que si el tamaño de un elemento cambia se corre el riesgo de superponer elementos como detallas que te ocurre.

<div id="superior" style="width:529px; height:200px; z-index:1; background-color: #999966; layer-background-color: #999966; border: 1px none #000000;">este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, este es el texto, </div>
<div id="inferior" style="width:530px; height:160px; z-index:2; background-color: #99CCFF; layer-background-color: #99CCFF; border: 1px none #000000;"></div>

lo unico que hice fue sacar un poco de codigo, para separarlos entre ellos puedes usar margin-top:10px por poner un ejemplo.
espero que haya servido de alguna ayuda, Saludos!

edudw · #5 (**permalink**) 25/05/2005, 21:36

vaya, la simplicidad de trabajar con Divs me impresiona, pero mas el hecho de que son cosas sencillas, pero no las "veo", eso es lo que necesitaba. Usaba posiciones absolutas por que aun no me manejo bien en los estilos padres, heredado y eso, en fin.
Ahora estoy tratando de posicionar un Div en el centro de la pagina, tal como cuando se usa align (en tablas), pero parece que con divs y .css es de otra manera.

Desde ya gracias nuevamente.