Css

Igualar columnas css sin hacks

0 268

Una de las cosas más difíciles de realizar en la maquetación mediante div’s y css’s es el hecho de igualar las columna en la mayoría de navegadores (lo que conocemos como Cross-Browser) sin ningún tipo de Hack o truco. Tras muchas páginas visitadas intentando dar respuesta esta necesidad encontré un artículo de Matthew james en su blog. El problema que plantea y su solución de tan sencillas que son sorprenden.

La estructura css es esta:

Column 1
Column 2
Column 3

El resultado de la css el siguiente:

#container3 {
float:left;
width:100%;
background:green;
overflow:hidden;
position:relative;
}
#container2 {
float:left;
width:100%;
background:yellow;
position:relative;
right:30%;
}
#container1 {
float:left;
width:100%;
background:red;
position:relative;
right:40%;
}
#col1 {
float:left;
width:26%;
position:relative;
left:72%;
overflow:hidden;
}
#col2 {
float:left;
width:36%;
position:relative;
left:76%;
overflow:hidden;
}
#col3 {
float:left;
width:26%;
position:relative;
left:80%;
overflow:hidden;
}

Leer artículo completo

Compartir:

Posts relacionados

Deja una contestación

Tu email no será publicado. Los campos obligatorios están marcados *

uno + 6 =

XI Edición Relatos Solidarios

Publicidad

Comentarios recientes

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.

ACEPTAR
Aviso de cookies