Probleme beim erstellen eines Layouts mit CSS
be_nearly
- css
Mein Problem liegt darin, das ich gerne ein Layout hätte, mit dem ich so wie es auch hier gezeigt wird, mit Kopfzeile, darunter 3 verschiedenen Spalten und darunter eine Fußzeile. Ich möchte zusätzlich dazu das Layout fest fixiert, sodass sich die Größe nicht an die Fenstergröße anpaßt. Wenn ich allerdings für alle einzelnen Teile eine Feste Breite und Höhe festlege, wird mir es im Internetexplorer im gesamten um einiges kleiner als im Firefox, in dem mir alles gezeigt wird, der IE schneidet einfach das ab was für Ihn keinen Platz mehr hat. Nun meine Frage, wo liegt hier das Problem, normal müssten die unterschiedlichen Browsern unter z.B. 80Pixel gleich anzeigen, wieso ist dies aber in der Praxis leider nicht so?
Im Vorraus schon einmal dankeschön für eure Hilfe.
Hello out there!
Ich möchte zusätzlich dazu das Layout fest fixiert, sodass sich die Größe nicht an die Fenstergröße anpaßt.
Diesen Wunsch solltest du vielleicht noch einmal überdenken. Und dabei Cheatahs Regel Nummer Eins der Usability beachten: „Was Du möchtest, ist egal. Was möchte der Benutzer?“ [Cheatah]
Die Kunst des Webdesigns ist es gerade, ein Layout so flexibel zu gestalten, dass es sich an verschiedene Gegebenheiten beim Nutzer (die der Webseitenautor weder kennt noch beeinflussen kann) anpasst.
See ya up the road,
Gunnar
Kommt drauf an.
Wenn Dein IE im Quirksmodus läuft (das ist der Fall wenn Du laut Doctype transitonal HTML verwendest) berechnet er das "Boxmodell" anders.
Richtig ist breite/Höhe + margin + padding.
Befindet sich der IE im Quirksmodus macht er dies falsch und addiert margin und padding nicht zur gesamt Breite/Höhe dazu.
Lösung: HTML 4.01 strict oder XHTML strict verwenden und im Doctpye entsprechend angeben (hier darauf achten dass die Doctype angabe in der allerersten Zeile des HTML-Dokuments steht, sonst ignoriert der IE die Doctypeangabe)
Richtig ist breite/Höhe + margin + padding.
Richtig ist das ja nun nicht wirklich.
Breite = margin-left + border-left + padding-left + width + padding-right + border-right + margin-right
Höhe = margin-top + border-top + padding-top + height + padding-bottom + border-bottom + margin-bottom
(Das width beim Rahmen habe ich weggelassen.)
Schön nachzulesen unter Selfhtml - Das Box-Modell
Gruß Ben
Hello out there!
Lösung: HTML 4.01 strict oder XHTML strict verwenden
Der Hinweis, die Strict-Varianten zu verwenden, ist nicht der falscheste. ;-)
Ob Strict oder Transitional hat aber nichts mit quirks/standards compliant modes zu tun.
See ya up the road,
Gunnar
Ob Strict oder Transitional hat aber nichts mit quirks/standards compliant modes zu tun.
Ok. Dann lerne ich jetzt hoffentlich dazu!
Wie ist das nun genau?
Reicht es den Doctype überhaupt anzugeben?
Hello out there!
Reicht es den Doctype überhaupt anzugeben?
Ja, komplett mit system identifier (URI), als erste Angabe im Dokument (keine XML-Deklaration vorher).
See ya up the road,
Gunnar