IE dělá problém při float

Ahoj všem. Prosím vás o radu, protože už nevím kde hledat chybu.

Struktura moji stránky je asi taková "Hlavíčka" menu a tak to mám pod jedním DIV.
Pak mám obsah stránky, druhé DIV. Tento DIV má třídu .mar_main_content s následujícím formátem:

.mar_main_content { clear:both;
margin-top:35;
margin-bottom:15;
margin-left:20;
margin-right:20;
padding-top:0;
} /* margin kolem stránky */

Problém nastává s vlastností margin-left:20 v kombinaci s prvkem INPUT, který obtéká (float).

Do obsahu stránky vkládám formulář. Ukázka jedné části:

<S class='gr CL'><LABEL class='la la3' for=i1>Váš email:</LABEL>
<INPUT id=i1 class='in in1' type='TEXT' name='email' size=25 maxlength='35' >
</S>

Kde je formát:

/* BLOCKS */
LABEL, S {
display:block;
}

/* FLOAT */
S { float:left;
}

/* BORDERS */
INPUT.in, textarea {
padding:0;
margin:0;
}

Všechny prvky uvnitř stránky jsou odsazeny od kraje díky
.mar_main_content { clear:both;
margin-left:20;
}

Jenže INPUT se odsazuje navíc o dalších cca 20px (od levého okraje stránky, tedy celkem 40px) přestože prvek INPUT má margin 0 a padding 0

Nevím co s tím... Opera a Mozilla problém nemá.

Díky moc, podívám se na to a snad to nějak půjde. Jednotky tam teď nemám

Ještě to nejde.

Ten prvek INPUT je uvnitř S.
S je nastaveno jako float: left.
INPUT nemá nastaven float, protože by ho měl pokud se nepletu dědit od S.
Zkoušel jsem dát css vlastnost disply:inline; pod INPUT (třída .in) a taky do S.
px jsem doplnil.
Ale nic z toho nezabralo.

Situace se komplikuje.

Nejen, že když nastavím display:inline; v prvku S, že to na IE nezabere, ale ještě mi to dělá "problém" v Mozille. Chtěl bych tam mít display:block; protože jestli sis všiml:

<LABEL class='la la3' for=i1>Váš email:</LABEL>

Ten label má pak .la3 {width:číslo} ... mám tam nastavenou šířku, aby se mi vytvořila taková pěkná hlavička. Ta hlavička má určitou barvu na pozadí a je stejně široká jako je prvek INPUT pod ní. Či-li když tam dám display:inline, tak se mi ta hlavička, neboli popisek nerozdáhne tak jak potřebuju, vlastnost width na to nelze aplikovat.

Jinak jsem zjistitl ještě tuto chybu: na začátku obsahu stránky (hned pod nadpisem formuláře) mám HR. No a mě se v IE zobrazují takové krátké horizontální čáry hned vpravo od toho INPUT. Je to něco z toho HR, dělá to tam rotiku.

Tak S existuje, já ho mám v HTML-kitu

Zřejmě to nevyřeším. Protože buď budu mít špatnou hlavičku nebo posunutý prvek formuláře.

Ale mohl bych načítat odlišný css pro IE. Už si však nepamatuju jak se taková podmínka dělá. Poradíš mi kde to najdu?

A dokonce i v mém počítači. Byl jsem lýný si vzpomenout kde...

Ale díky chlapy

Vyřešeno.

<S class='gr CL'><LABEL class='la la3' for=i1>Váš email:</LABEL>
<DIV>
<INPUT id=i1 class='in in1' type='TEXT' name='email' size=25 maxlength='35' >
</DIV>
</S>