hi...
das hat mit typo3 wenig zu tun und... na klar geht das:
z.B. wenn du dein label links vor dem formfeld haben willst... und selbige immer gleich groß sein sollen... das nächste feld in der nächsten zeile erscheinen soll... dann kannst du es z.B. so machen:
Beispiel (habe ich mal eben so zusammengeschustert - nur das du ne idee bekommst:sad:
HTML-Code:
<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>css-form</title> <style type="text/css" media="screen">
/*fix default browserspaces between elements*/
* {
padding:0px;
margin:0px;
}
body {
font-family: Georgia, Times New Roman, Times, serif;
font-size: 12px;
color: #000000;
background-color: #FFFFFF;
padding: 10px;
}
h1 {
font-size: 14px;
font-weight:bold;
background:#F4F4F4;
display:block;
padding:5px;
border-bottom: 1px dotted #333;
margin-bottom:10px;
}
a:link, a:visited, a:active {
color: #666666;
text-decoration: none;
}
a:hover {
text-decoration: underline;
color: #333333;
}
label {
float:left;
display:block;
width:100px;
margin-bottom:10px;
padding-left:10px;
}
input, textarea, select {
float:left;
display:block;
width:250px;
border: 1px solid #333;
background:#F4F4F4;
font-family: Georgia, Times New Roman, Times, serif;
font-size: 12px;
margin-bottom:10px;
padding:1px;
}
/*clearing all floats and fix firefox and ie backgroundcolor-bug */
div.clearer {
clear:both;
font-size:1px;
line-height:1px;
display:block;
height:1px;
}
form {
background:#EFEFEF;
width:400px;
border: 1px dotted #333;
}
.form-button {
margin-left:110px !important;
margin-left:55px; /*to fix ie6 position*/
width:100px;
}
.option {
border:none;
background:none;
width:auto;
}
fieldset {
border:none;
padding-left:100px;
padding-bottom:10px;
display:block;
}
fieldset input {
width:auto;
border:none;
background:none;
float:left;
display:block;
margin-right:10px;
margin-top:3px !important;
margin-top:0px; /*to fix ie6 position*/
}
fieldset label {
width:auto;
float:left;
display:block;
padding-right:2px;
white-space:nowrap; /*to fix ie6 wrapping*/
}
</style> </head> <body> <form action="#" method="post" enctype="application/x-www-form-urlencoded" id="deineform"> <h1>Kontakt</h1> <div class="form-css"> <label for="name">Name:</label> <input type="text" name="name" id="name" /> <div class="clearer"> </div> <label for="adresse">Adresse:</label> <input type="text" name="adresse" id="adresse" /> <div class="clearer"> </div> <label for="nachricht">Nachricht:</label> <textarea name="nachricht" rows="5" cols="50" id="nachricht"></textarea> <div class="clearer"> </div> <fieldset> <label for="option1">Option 1</label> <input name="optionen" type="radio" value="wert1" id="option1" checked="checked" /> <label for="option2">Option 2</label> <input name="optionen" type="radio" value="wert2" id="option2" /> <label for="option3">Option 3</label> <input name="optionen" type="radio" value="wert3" id="option3" /> </fieldset> <div class="clearer"> </div> <fieldset> <label for="check1">Check 1</label> <input name="check1" type="checkbox" value="wert1" id="check1" checked="checked" /> <label for="check2">Check 2</label> <input name="check2" type="checkbox" value="wert2" id="check2" /> <label for="check3">Check 3</label> <input name="check3" type="checkbox" value="wert3" id="check3" /> </fieldset> <div class="clearer"> </div> <label for="select">Anliegen:</label> <select name="liste" id="select"> <option value="wert1">wert1</option> <option value="wert2">wert2</option> <option value="wert3">wert3</option> </select> <div class="clearer"> </div> <input name="absenden" type="button" value="Senden" class="form-button" /> <div class="clearer"> </div> </div> </form> </body> </html>