[Ovillo] Trabajar con EMs

["Hernán Beati - SaberWeb.com.ar"]

Ramón Corominas escribió:
> Ay, Hernán, siempre te quedas en lo simple...

Ay, ay, ay, Ramón!... Y tú que complicas lo que de veras ES simple... jaja!

La solución:
http://www.saberweb.com.ar/prueba/divs4.htm

Te sugiero estudiar a fondo el posicionamiento CSS.

Existen 4 tipos de posicionamiento: static, absolute, relative y fixed.
La "noticia de ayer" es que se pueden combinar entre sí, según la 
necesidad concreta que tengas.

> 
> Que yo haya puesto un ejemplo tan simplón no quiere decir que ese sea el 
> layout "normal" que uno se va a encontrar o que puede desear. Si me 
> sirviera el posicionamiento absoluto no haría falta tanta complicación, 
> obviamente, pero no sirve. 

Por supuesto que SI sirve, dentro de contenedores "relative".


> Me explico:
> 
> Imagina que debajo del menú y de los contenidos quiero otro contenido 
> que se expanda a las dos columnas (o a las 3, 4 o X que quiera poner, 
> así de chulo soy).


Entonces, al "menu" y el "contenido" que tenías hasta ahora, los 
envuelves en un div contenedor (ya lo tienes en tu marcado, es ese div 
al que le has colocado el class="row").

Tienes tu primera "fila" horizontal.

Si debajo quieres otro contenido que se expanda las 2, 3 o 4 columnas, 
que "así de chulo eres", jaja!... simplemente pones otro div class="row" 
que haga de contenedor de esa segunda "fila", y verás que se queda 
quietecito debajo de manú y contenido, a lo ancho de la pantalla. Si ese 
div es relative, dentro de esa segunda fila creada puedes poner 
nuevamente otros divs absolutos como el menu, tanto a izquierda como a 
derecha. Solo cambias left:0 por rigth:0 y se acomodarán a ambos lados.


> Imagina también que cualquiera de las columnas, 
> pueden tener distintas alturas, unas más altas que otras, y que 
> cualesquiera que sean esas alturas, el contenido inferior siempre debe 
> quedar por debajo de la columna más alta, que empujará hacia abajo ese 
> contenido.

Ya está hecho, cada div class="row" que agregues hará eso, bajará hasta 
debajo de la columna más alta de su div class="row" (fila) anterior.


> 
> Ahora mira a ver cómo haces eso con posicionamiento absoluto.
>

Míralo tú, lo hice partiendo de tu propio código: 2 columnas, 3 
columnas, y pie de una sola columna:

http://www.saberweb.com.ar/prueba/divs4.htm


--
Hernán Beati
http://www.saberweb.com.ar