nicht angemeldet
Hallo
ich glaub ich hab zufällig eine neue Lösung für den 3px Gap gefunden, über den ich immer wieder stolpere. Bei einem Webprojekt musste ich mit einer Minimalhöhe für ein div arbeiten. Firefox kennt ja minheight, IE nicht. Beim rumprobieren ist mir dann aufgefallen, dass man IE nur explizit eine Höhe mitgeben muss, sowie die marginwerte anpassen muss. Die Lösungen die ich bis anhin von positioniseverything verwendet hatte funzten in diesem Projekt nicht, da sie andere Fehler in IE hervorriefen. Mit Hilfe der Höhenangabe funzte es prima und ich habe es eben in einem aktuellen Projekt wieder benutzt, ohne dabei auf andere Probleme gestossen zu sein. Vielleicht checkt ihr das mal weiter aus, oder gebt mir Feedback, was ihr davon haltet. Ist für mich bisher die simpelste und wie's scheint sicherste Methode den 3px Bug zu eliminieren.
Hier noch der Code:
Ist ein simples Layout mit einer linken Spalte (subnavi) und einem Inhaltsteil (inhalt).
#subnavi {
width: 150px;
padding-top: 5px;
float: left;
}
#inhalt {
margin-left: 325px;
}
Die folgenden Angaben erkennt nur IE. Beim Element, das neben
dem floatenden steht, zusätzlich Höhe angeben. IE geht damit um,
als ob es ein min-height-Element wäre, wächst also bei mehr Inhalt
mit und ist somit problemlos einsetzbar. Der Marginwert um 3px
reduzieren.
Dem floatenden Element zusätzlich ein Negativmargin -3px mitgeben.
Bei rechtsfloatenden Elementen die 3px einfach umkehren.
* html #inhalt {
height: 400px;
margin-left: 322px;
}
* html #subnavi {
margin-right: -3px;
}
Bin auf euer Feedback gespannt.
Grüsse
Pierre