HTML Anordnung von Radiound

[Tron36]

Anordnung von Radio- und Chechbox groups

Hallo Leute,

ich hab folgenden code geschrieben:

<div id="content">Content
	<form method="post" action="Auswahl_Validation.php">
		<fieldset> <!-- Zeit Auswählen -->
			<input type="radio" id="zeitraum" name="Zahlmethode" value="Mastercard">
			<label for="mc"> Mastercard</label><br>
			
			<input type="radio" id="aktuell" name="Zahlmethode" value="Visa">
			<label for="vi"> Visa</label><br>
		</fieldset>
		
		<fieldset>	<!-- Kanal Auswählen -->
			<legend>Verbrauchskanal auswählen:</legend>
			
			<input name="zaeler" type="checkbox" value="1" id="KanalA" />							
			<label for="KanalA">Kanal 1</label><br />
			
			<input name="zaeler" type="checkbox" value="2" id="KanalB" />					
			<label for="KanalB">Kanal 2</label><br />
			
			<input name="zaeler" type="checkbox" value="3" id="KanalC" />
			<label for="KanalC">Kanal 3</label><br />
			
			<input name="zaeler" type="checkbox" value="4" id="KanalD" />
			<label for="KanalD">Kanal 4</label><br />
			
		</fieldset>
		
		<fieldset>
			<legend>Zeitraum</legend>
			
			<label for="beginDatum">Begin</label><br />
			<input type="text" name="zeitraumBegin" id="beginDatum" />
			
			<label for="lastname">Ende</label><br />
			<input type="text" name="zeitraumEnde" id="enddatum" />
		</fieldset>
		
		<p>
			<input type="submit" name="action" value="Register" />
			<input type="reset" value="Reset Form" />
			<input type="hidden" name="session" value="A398DF991" />
		</p>
	</form>

</div>

Hier der CSS-Code:

div#navi a {
 display:block;
 margin-top:10px;
 margin-left:5px;
 margin-right:5px;
 background:silver;
 color:black;
 text-decoration:none;
 text-align:left;
}
a:hover{
  background-color: #0efdf4;
}
div#navi a:hover {
 display:block;
 background:green;
 color:yellow;
 text-align:center;
}

/************* Content *******/
div#content {
 background:papayawhip;
 width:650px;
 height:400px;
 text-align: left;
 float:left;
}
/************* Marginal *******/
div#marginal {
 background-color:silver;
 width:160px;
 height:400px;
 float:right;
}

/************* Fußbereich *******/
div#footer {
 background:lightsteelblue;
 height:80px;
 clear:right;
}

Die Sache ist, dass ich ein Radio-Button, ein Checkbox-Group und 2 Text"flächen" für Datumseingaben habe.
in der aktuellen Darstellung ist es so, dass diese 3 Gruppen untereinander dargestellt werden. Wie kriegt man das so hin, dass diese 3 Gruppen nebeneinander dargestellt werden? Wie kann man die 2 Text"flächen", in Abhängigkeit von der Auswahl der Radiobuttons "ein- und ausschalten"?

Ich würde mich um eure Hilfe freuen.

Viele Grüße
Tron36

 

[ranzassel]