Layout, Float Problem...

[snooze7]

Hallo zusammen,

ich hab ein Layoutproblem. Leider ist es wahrscheinlich nicht so einfach zu lösen, aber vielleicht erbarmt sich doch jemand...;Jump

Unter Versicherungsstelle Veronika Cramer ist mein aktueller Entwurf. Als Grafik soll das ganze so aussehen (Boylayout) http://www.ergo-webdesign.de/mist/layout.gif .

Ich orientiere mich an diesem yaml Layout Paket (die IEHacks sind einfach klasse dort), allerdings klappt es nicht so wie es soll. Die beiden Ebenen im Header werden nicht umschlossen, sondern haben sich selbstständig gemacht. Was mach ich falsch?

Gibt es denn keinen grundlegenden - vielleicht auch einfachen - Layoutvorschlag mit 3 Mittelebenen, die variablen sind? Yaml ist sehr kompliziert aufgebaut und außerdem ist yaml soviel ich weiß kommerziell.

Noch ein kleineres Problem am Rande: Wie schaffe ich dem header eine 2px border-bottom hinzufügen (graue 2 Pixel Linie am Rand des Headers), jedoch die graue Linie auf der rechten Seite um 8 Pixel verschwinden zu lassen (weiße Fläche). Siehe dieses Bild http://www.ergo-webdesign.de/mist/problem.gif . Der leicht grüne Hintergrund soll die Gesamtgröße der Ebene sein.

Hopefully thx.

Snooze7

 

[neuroleptika]

Du hast jedem gefloateten Element ein clear gegeben.
Damit sind die Floats aber noch nicht eingeschlossen.
Du könntest das umschließende Element selber floaten:

#header
background-color:#FFFFFF;
[COLOR="DarkRed"][B]float:left;[/B][/COLOR]
padding-left:25px;
padding-right:25px;
padding-top:25px;
position:relative;
text-align:left;

Damit würdest du das Problem aber nur weiter nach unten verschieben.

Clearfix währe eine Möglichkeit:
Einschließen von Floats ohne zusätzliches Markup - easyclear("Clearing" im 21. Jhdt.)
oder ein Weiteres clearendes Element einfügen.
Für den IE würde haslyout für #header reichen.

Für yaml brauchst du keine Lizenz kaufen.
Allerdings solltest du sein Buch dazu lesen.

Ich kenne mich jedoch nicht mit yaml aus