Thomäs: Postionierung von Formularfeldern in einem Container

Beitrag lesen

Hallo Wissende!

Mit folgendem Code versuche ich FormularElemente in einem Container zu platzieren und zu positionieren. Ich habe es alles über Span-Elemente erledigt. Nun möchte ich aber, das die Positionierung innerhalb eine DIV_Containers vorgenommen wird, so das ich nur noch den gesamten Container verschieben muss.

Allerdings klappt es nicht. Wenn ich den CSS-Posiotnierungsbefehl mittel Relative ausführe, wird alles total verschoben, da dies wohl auch was mit Eltern und Kindern zu tun hat.

Wenn ich es mit absolut mache, ist es immer als links oben und nicht wirklich innerhalb des gewünschten Containers.

Wer kann mir helfen oder mal einen Tipp geben?

<body>
<div align="center" style="height:60;">
<h1 class="farbig">Kontaktformular</h1>
<p class="anno">Mit diesem Formular können Sie uns erreichen.</p>
<!--in diesem container sollen die formularfelder positioniert werden-->
  <div style="top:65;" align="center">
<span class="td" style="position:relative;left:20;top:10;">Vorname</span><input type="text" name="VName" value="" size="20" MaxLength="40"class="farbig"  style="position:relative;left:120;top:10;width:121;">
<span class="td" style="position:relative;left:20;top:37;">Name</span><input type="text" name="Name" value="" size="20" MaxLength="40"class="farbig"  style="position:relative;left:120;top:37;width:121;">
<span class="td" style="position:relative;left:260;top:8;">E-Mail</span><input type="text" name="SenderMail" value="" size="20" MaxLength="40"class="farbig"  style="position:relative;left:360;top:8;width:121;">
<span class="td" style="position:relative;left:260;top:35;">Homepage</span><input type="text" name="Homepage" value="" size="20" MaxLength="40"class="farbig"  style="position:relative;left:360;top:35;width:121;">
<span class="td" style="position:relative;left:20;top:78;">Ihr Text</span><textarea name="Text"class="farbig"  cols="15" rows="5" style="position:relative;left:120;top:78;width:361;"></textarea>
  </div>
<input type="submit" name="next" value="Abschicken" class="farbig">
<input type="reset" name="next" value="Zurücksetzen" class="farbig">
<input type="button" name="print" value="Drucken" class="farbig" onClick="javascript:window.print()">
</div>
</body>
</html>