carmen, imaginate que un elemento flotado esta, en efecto, flotando
sobre la pagina. por eso tu contenedor no lo contiene, es como si
estuviera vac�o.
al poner un elemento con clear, estiras el contenedor de manera que
englobe los floats.
espero que esto te ayude un poco :)
saludos!
kemie
...........:| kemie |:...........
.:| www.monolinea.com <http://www.monolinea.com> |:.
Carmen Ugarte Garcia wrote:
Hola, Chan:
Gracias por tu respuesta y tambi�n por tu pel�n de iron�a, que me has
alegrado la ma�ana, pero te agradecer�a que me explicaras, aunque fuera en
ingl�s, qu� quieres decir con eso de "convertir tu `div` contenedor en un
aut�ntico contenedor".
Me he repasado el modelo de cajas en la especificaci�n y no veo la raz�n
por la que mi div contenedor no sea un contenedor de los elementos
incluidos en �l.
Es m�s, estoy segura de haber utilizado esto alguna vez m�s, en parecidos
ejemplos algo m�s complicados, seguro que me funcionaron por chiripa, pero
ahora quiero salir de la chiripa.
Por los documentos a los que me remites me da la sensaci�n de que me has
interpretado justo al rev�s de lo que me ocurre, porque precisamente esta
vez se me comporta como si el div contenedor fuera un elemento float y yo
le hubiera metido un clear antes de los otros float, porque
impepinablemente me los coloca debajo de la caja contenedora.
Para tu tranquilidad te dir� que antes de pedir �rnica jugu� bastante con
"clear" y lo �nico que hac�a era empeorar la cosa am�n de complicarla
innecesariamente. Lo que yo quiero hacer es tan sencillo que tiene que ser
una tonter�a lo que se me escapa, pero no la veo.
En fin, seguir� probando y remirando los float y gracias por los
documentos, que s� que son interesantes.
Mar�a del Carmen Ugarte Garc�a
"Choan C. G�lvez"
<[EMAIL PROTECTED]
e.com> To
Sent by: "Ovillo, la lista de CSS en
[EMAIL PROTECTED] castellano"
sts.ovillo.org <[email protected]>
cc
01/06/2005 17:37 Subject
Re: [Ovillo] A vueltas con los div
y los floats
Please respond to
"Ovillo, la lista
de CSS en
castellano"
Carmen, encontrar�s mi respuesta m�s abajo
Carmen Ugarte Garcia escribi�:
Ando dando vueltas a un ejemplo simple y tonto pero en el que no termino
de encontrar el fallo:
Tengo una caja contenedora definida de la siguiente manera:
.contenedor {margin: 30px; border: solid 1px; background-color: white;}
y dentro de esa tras una cabecera de tipo 1 quiero meter las cl�sicas dos
columnas, una a la izquierda y otra a la derecha:
.izda {float: left; width: 40%; padding: 10px; margin: 5px;
background-color: blue; }
.dcha {float: right; width: 40%; padding: 10px; margin: 5px;
background-color: red;}
(los colores de fondo los he metido solo para ver si encontraba pistas)
y en HTML
<div class="contenedor">
<h1>T�tulo</h1>
<div class="izda">
<ul>
<li>...</li>
</ul>
</div>
<div class="dcha">
<ul>
<li>...</li>
</ul>
</div>
</div> <!--- contenedor--->
Pues digamos que la capa "contenedor" se me cierra antes de empezar las
otras, coloc�ndose estas debjao de aquella.
He probado a quitar la cabecera <h1> pero entonces me sale una raya, es
decir la capa "contenedor" se me reduce a una raya.
�Qu� me falta, que no lo veo?
Pues te falta convertir tu `div` contenedor en un aut�ntico contenedor.
Si dominas el ingl�s, deber�as leer, para empezar [Containing
Floats][1]. Si no lo dominas, est�s perezosa o [inserte aqu� cualquier
excusa], todos estos mandamientos se resumen en...
1. Puedes hacer que el `contenedor` sea realmente un contenedor, tachan
tachan, haci�ndolo flotar o
2. Puedes hacer que el `contenedor` se expanda incluyendo tras los
elementos flotantes un elemento "limpiador", esto es, un `<div
class="loqueteapetezca"></div>` con un estilo asignado tal que
.loqueteapetezca { clear: both; }
o
3. Puedes hacer que el contenedor se expanda aplicando la nov�sima
t�cnica del `overflow`, consistente en asignar al contenedor un
`overflow: auto;`.
Si mis palabras no te convencen, oh incr�dula, puede que las de otros lo
hagan: �chale una ojeada a [Clearing Space][2] en el [wiki de
CSS-Discuss][3]
[1]: http://www.complexspiral.com/publications/containing-floats/
[2]: http://css-discuss.incutio.com/?page=ClearingSpace
[3]: http://css-discuss.incutio.com/?page=FrontPage
Salud,
Choan
--
Mundo Du. Cuentos breves, relatos sorprendentes
http://du.lacalabaza.net/
Dizque. Cosas que me van y me vienen
http://dizque.lacalabaza.net/
_______________________________________________
Lista de distribuci�n Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente direcci�n:
http://ovillo.org/mailman/listinfo/ovillo
_______________________________________________
Lista de distribuci�n Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente direcci�n:
http://ovillo.org/mailman/listinfo/ovillo
_______________________________________________
Lista de distribuci�n Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente direcci�n:
http://ovillo.org/mailman/listinfo/ovillo
