De nada, me alegra que te haya servido.
Me corrijo: donde dije
"restarle la última columna" debería haber dicho
"restarle el último medianil" (margen).
La 3ra solucion no es idea mía, la aprendí acá en el foro, no recuerdo el autor.
Se puede presentar el caso de que necesites colocar medianil horizontal y tengas un alto variable en las cajas flotadas (si fueran altos fijo sería sencillo de resolver). Así que lo hice agregando un pequeño script mediante el cual, detectamos el alto de la caja padre de los elementos flotados, alto al cual le restamos el medianil y lo asignamos al cpntenedor #wrap
Con medianil horizontal:
Código HTML:
Ver original <p class="el">lorem ipsum dolor amet... 1234567899876543212345
</p> <p class="el">lorem ipsum dolor amet... 1234567899876543212345
</p> <p class="el">lorem ipsum dolor amet... 1234567899876543212345
</p> <p class="el">lorem ipsum dolor amet... 1234567899876543212345
</p> <p class="el">lorem ipsum dolor amet... 1234567899876543212345
</p> <p class="el">lorem ipsum dolor amet... 1234567899876543212345
</p>
Código CSS:
Ver original*{outline:1px solid cyan;}
body{
font:16px arial;
}
#wrap{
overflow:hidden;
width:380px; /* w: 390 - right*/
background:red;
}
#elems{
width:390px; /* w: 130 * 3 */
overflow:hidden;
background:gray;
}
.el{
background:gray;
float: left;
word-wrap: break-word;
width: 100px;
padding:10px;
margin:0 10px 10px 0; /* right = 10*/
/* total width: 100 + 20 + 10 */
}
Código Javascript
:
Ver original/* requiere jquery */
var heightElems = $("#elems").outerHeight();
var heightMedianil = 10;
var heightWrap = heightElems - heightMedianil + "px";
$("#wrap").css({"height" : heightWrap});
Saludos
edito: Al cargar primero el css y luego el js se puede producir un efecto pestaneo en el medianil inferior, puesto que al cargar la pagina renderiza primero el html/css. lo que se puede resolver fácilmente
ver.
