Solucionar margin con porcentaje en ie6

Dany_s · #1 (**permalink**) 12/08/2010, 08:05

Tengo un problema en ie 6 con el margin con porcentaje, es como que me lo duplica

La única forma que encontré es indicarle otro valor para ie6 con "_margin-right" pero me gustaría saber si hay otra forma o si algo no lo hago bien

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <title>JSP Page</title>
        <style>
            .contenedor{width:300px; height:400px; background:red; padding:3px}
            .de50{float:left; width:45%; background:white; padding:2%; margin-right:2%;}
            .noMargin{margin-right:0}
        </style>
    </head>
    <body>
        <div class="contenedor">
            <div class="de50">Uno</div>
            <div class="de50 noMargin">Dos</div>
        </div>
    </body>
</html>

La idea es crear divs de 25% para tener 4 columnas, 33% para tener 3 y así para poder modificar sólo el contenedor y que se ajusten las columnas.

Pero la verdad no sé si usan mucho ie6, por las dudas

alexk · #2 (**permalink**) 12/08/2010, 08:20

es un problema tipico en ie6 el "duplicado de margin" en elementos flotados
un pequeño fix seria agregar display:inline;

Código CSS:

Ver original.de50{float:left;display:inline;}

Dany_s · #3 (**permalink**) 12/08/2010, 08:35

gracias,
lo había probado pero no me da resultados :( funciona sólo si le saco el doctype