Anton: Formular ohne Tabellen formatieren

Beitrag lesen

SELF-Forum

Formular ohne Tabellen formatieren

Anton
– Informationen zu den Bewertungsregeln

Hallo,

ich habe eine Frage zu diesem Quelltext:

  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
  
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">  
  
<head>  
	<title>Test</title>  
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>  
	<style type="text/css">  
		*{  
			padding: 0px;  
			margin: 0px;  
		}  
  
		body {  
			width: 1000px;	  
			margin: 0px auto;  
		}  
  
		#header {	  
			height: 150px;  
			background: blue;  
		}  
  
		#content {  
			float: right;  
			width: 700px;  
			background: green;  
		}  
  
		#navigation {  
			float: left;  
			width: 300px;  
			background: orange;  
		}  
  
		#footer {  
			clear: both;  
			width: 1000px;  
			background: yellow  
		}  
		  
		form label {  
			float: left;  
			width: 200px; 	  
		}  
	</style>  
</head>	  
	  
<body>  
	<h1 id="header">Titel der Seite</h1>  
	  
	<div id="content">  
		<form>  
			<p><label>Vorname*:</label><input type="text"</p>  
			<p><label>Nachname*:</label><input type="text"</p>  
			<p><label>Firma:</label><input type="text"</p>  
			<p><label>Straße + Hausnummer:</label><input type="text"</p>  
			<p><label>PLZ + Ort:</label><input type="text" name="location"</p>  
			<p><label>Telefon:</label><input type="text" name="phone"</p>  
			<p><label>E-Mail*:</label><input type="text" name="email"</p>  
			<p><label>Anfrage*:</label><textarea></textarea></p>  
			<p>  
				<input type="reset" value="löschen"/>  
				<input type="submit" value="absenden"/>  
			</p>  
		</form>  
	</div>  
	  
	<ul id="navigation">  
		<li><a href="#">Startseite</a></li>  
		<li><a href="#">Link2</a></li>  
		<li><a href="#">Link3</a></li>  
	</ul>  
	  
	<address id="footer">&copy; Copyright...</address>  
</body>	  
</html>

Dem Label "Anfrage" vor dem Textarea habe ich eine feste Breite von 200 Pixeln zugewiesen. Dem Textarea selbst würde ich gerne den restlichen verfügbaren Platz innerhalb des übergeordneten Content-DIV-Containers zuordnen. Unterhalb des Textareas sollen sich die beiden Buttons "löschen" und "absenden" befinden. In der Summe sollen die beiden Buttons genauso breit wie das Textarea selbst sein. Demnach soll jeder der beiden Buttons halb so breit wie das Textarea sein.

Wie könnte man dies am besten mit CSS umsetzen?

Beitrag melden
–
Informationen zu den Bewertungsregeln