Div y tamaños

[arcanisgk122]

hola amigos tengo un problema con Div o varios mejor dicho.

tengo 3 div una al lado del otro, el problema es que cada uno tiene un ALTO diferente y no se como ponerlos del mismo alto ojo están dentro de un div contenedor sin alto y el div del centro su alto es dinámico por que contiene texto.

El CSS que tengo es este

Código CSS:

.1per {width:1000px;}
.lf {float:left;}
.lc {clear:both;}
.rizq{width:20%;}
.rcen{width:60%; font-size:14px;}
.rder{width:20%;}
 

estos son los Div

Código HTML:

<div class="1per lc">
    <div class="rizq lf"><img src="imagen.jpg"></div>
    <div class="rcen lf">
        <p>texto</p>
        <ul>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
            <li>texto</li>
        </ul>
    </div>
    <div class="rder lf"><img src="imagen.jpg"></div>
</div>
 

La idea era poner los 3 div del mismo alto de forma dinámica y que la imagen que lleva se centren a ve quien me da una mano..

[daenerys_]

Has probado en ponerle una altura que sea auto??? osea height: auto y flotarlo todo a la izquierda float:left cada div.

[ArturoGallegos]

con CSS no me viene nada a la mente pero con jQuery puedes hacer algo como esto

Código Javascript:

$('.1per').each(function(){
        var highestBox = 0;
        $('div.lf', this).each(function(){
            if($(this).height() > highestBox)
            highestBox = $(this).height();
        });
        $('div.lf',this).height(highestBox);
    });
 

Has de considerar que no esta permitido que las clases o identificadores empiecen con un numero, así que no se si te funcione bien, te recomiendo corregir eso.

[seoista]

Iniciado por arcanisgk122

El CSS que tengo es este

Código CSS:

.1per {width:1000px;}
.lf {float:left;}
.lc {clear:both;}
.rizq{width:20%;}
.rcen{width:60%; font-size:14px;}
.rder{width:20%;}
 

Los identificadores no pueden empezar por números.

Cambialo así:

.per1 {width:1000px;}
.lf {float:left;}
.lc {clear:both;}
.rizq{width:20%;}
.rcen{width:60%; font-size:14px;}
.rder{width:20%;}

Saludos.