HTML/CSS Probleme mit float

Crazy_EB · 20 August 2011

Hallo!

Ich habe Probleme mit zwei Div-Boxen.

Ich will, dass der Header und der Footer die komplette Breite des Browsers ausnutzen.
Zwischen den beiden sollen nebeneinander zwei Boxen sein, links das Menü, rechts der Content.

Ich habe versucht, dies mit float: left zu lösen. Klappt im FF 5 ganz gut, wenn man sich jedoch die anderen Browser ansieht, ist bei allen Browsern die Contentbox unter der Menübox.

Wo hab ich in meiner Divsuppe denn den Fehler? :ugly:

Links
HTML-Code
CSS-Code
Browser-Screenshots

Kralle93 · 20 August 2011

Versuch mal das als Deklaration:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">

Bei falscher Deklaration springt vorallem der IE gerne in den Quirks-Modus.

Lg

Moloc · 20 August 2011

Wenn das Browserfenster zu wenig breit ist, wird beim float das passieren, was du in den Bildern siehst.

Setze width (oder min-width) von #main. Dann sollte das problem nicht mehr exisiteren, da du dann genügend "Platz" hast.

PS: Die Bilder kannst du gut durch CSS ersetzen (background-color, border, border-radius,...)

joschilein · 20 August 2011

Wenn du #rechts weglässt dürfte dieses Beispiel deinen Wünschen entsprechen.

Crazy_EB · 20 August 2011

Moloc schrieb:
Wenn das Browserfenster zu wenig breit ist, wird beim float das passieren, was du in den Bildern siehst.

Setze width (oder min-width) von #main. Dann sollte das problem nicht mehr exisiteren, da du dann genügend "Platz" hast.

PS: Die Bilder kannst du gut durch CSS ersetzen (background-color, border, border-radius,...)

Vielen Dank.
Es lag tatsächlich an der Breite. Ich hab den Contentbereich entsprechend verschmälert und die Boxen werden nun richtig nebeneinander dargestellt.

HTML/CSS Probleme mit float

Crazy_EB

Well-known member

Kralle93

Programmierer

Moloc

Well-known member

joschilein

Multitalent

Crazy_EB

Well-known member

Ähnliche Themen