✔ Grafisches Layout in CSS darstellen.

[Maik]

Geh ich recht in der Annahme, dass die linke Spalte einen linken Außenabstand von 50px besitzen soll?

Dann lautet die margin-Deklaration folgendermaßen:

div#leftCol {
margin: 0 0 0 50px; /* Außenabstand oben - rechts - unten - links */
width: 140px;
float: left;
}

Für die älteren IEs bis einschliesslich dem IE6 mußt du in dieser Regel noch zusätzlich display:inline als Bugfix gegen den "IE Doubled Float-Margin Bug" notieren, da sie ansonsten den horizontalen margin-Wert auf 100px verdoppeln.

mfg Maik

 

[AbsolutelyMy]

Hey danke Maik, das klappt alles super.

Doch jetzt kommt das nächste problem mit dem Content. Er sieht je nach Browser mal groß oder mal klein aus. Weißt du ob es an dem CSS liegt? das es fehler bereitet?

div#centerCol {
	margin: 0 210px;
	background: url(slice/news2.jpg) repeat-y;
}

Danke schonmal

 

[Maik]

Der CSS-Code ist vollkommen in Ordnung

Vielmehr liegt es an der Klasse .clearfix, die du im DIV #centerCol aufrufst, obwohl sie dort derzeit überhaupt nicht benötigt wird, da in dieser Box keine Floatumgebung enthalten ist, die mit dieser Klasse aufgehoben ("gecleart") werden müsste, wie beispielsweise im Elternelement #wrapper, das die drei floatenden Spaltenblöcke in sich aufnimmt.

Wenn ich sie aus dem Element entferne, wird #centerCol in allen mir zur Verfügung stehenden Browser gleich hoch dargestellt.

mfg Maik

 

[AbsolutelyMy]

Vielen Dank, echt super wie du das alles beschreibst. Vorallem dein letzter Beitrag war sehr informativ und hat mir sehr viel weiter geholfen. Auch vom verstehen des CSS und wie es Arbeitet, was für mich sehr wichtig ist um es zu verstehen.

Danke dir vielmals , und ich werde jetzt den Thread als Erledigt makieren!

 

[Maik]

Keine Ursache, ich hab dich gerne bei deinen ersten Schritten in der Formatierungssprache unterstützend begleitet - und immer wieder gerne

mfg Maik