float zerschießt mir mein Layout

[Der Martin]

Hallo,

Das Layout sollte am Ende zweispaltig sein.
Link: http://benedikt86.bplaced.de/imke/fragebogen.php

das ist kein Link. Das da ist einer -> http://benedikt86.bplaced.de/imke/fragebogen.php ;-)

Ja, so übersichtlich dein Quellcode auch ist (dafür ein ehrliches Lob!), da ist einiges, was negativ auffällt.

Als erstes natürlich die Fülle von div-Containern, geradeso als gäbe es keine passenderen Elemente. Zum Beispiel deutet <div id="titel"> und <div id="subtitel"> unmissverständlich darauf hin, dass es in Wirklichkeit ein <h1>, <h2> oder entsprechend sein möchte; die Blöcke innerhalb des Formulars wären optimal als <fieldset> ausgezeichnet; die Beschriftungen der Eingabefelder möchten <label> sein; die teils doppelt oder dreifach auftretenden br-Elemente möchten zugunsten von Abständen (CSS) völlig eliminiert werden.

Dann sehe ich, dass du mehrere Elemente mit derselben ID hast - klarer Fehler, das darf nicht sein.

Falsch ist auch folgende Verschachtelung, denn ein Absatz (p-Element) darf kein weiteres Blockelement enthalten:

<p><div id="left">  
  <input type="radio" name="abschnitt1" value="innerorts"/> Innerorts <br />  
  <input type="radio" name="abschnitt1" value="ortsrand" /> Ortsrandlage <br />  
  <input type="radio" name="abschnitt1" value="aussen"/> außerhalb einer Ortschaft  
 </div>  
  
 <div id="right">  
  <input type="checkbox" name="abschnitt2[]" value="wald"/> Wald / Forst <br />  
  <input type="checkbox" name="abschnitt2[]" value="gehoelz"/> Gehölze / Gehölzsaum / Einzelbäume <br />  
  [...]  
</div></p>

Und seltsam mutet dein Versuch der Positionierung an, als Beispiel:

#left {
  position: relative;
  left: 0;
  width: 50%;
  background: #FFF;
  -moz-box-flex: 1;
  -webkit-box-flex: 1;
  box-flex: 1;
}

Bist du dir über die Auswirkung von position:relative im Klaren? Insbesondere bei den Boxen, die rechts stehen sollen, habe ich nicht den Eindruck.

Ich habe allerdings den Eindruck, dass du die Boxen am besten weder positionieren noch floaten solltest, sondern einfach als display:inline-block und mit einer Breite von 50% (oder etwas weniger) formatieren solltest.

So long,
 Martin