Tina: zweispaltiges Formular

Beitrag lesen

SELF-Forum

zweispaltiges Formular

Tina
– Informationen zu den Bewertungsregeln

'br' ist in den seltensten Fällen angebracht.
label {display: block} und/oder input {display: block}.

habe die br jetz ausgebaut.
Das Problem, dass die langen Labels nicht umbrochen werden bleibt aber.
HAbt Ihr noch nen Tip?

<!DOCTYPE html  
     PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">  
<head>  
<title>TEST</title>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>  
<style type="text/css">  
  
form { width: 100%;  min-width: 300px; background-color:silver;}  
fieldset { float: left; border: none; }  
  fieldset .spalte1 { margin: 10px; padding-right:10px; border-right:1px solid black;min-width:200px; background-color:blue;}  
  fieldset .spalte2 { margin: 10px; min-width:300px; background-color:green;}  
  fieldset label {color:red; min-width:200px; display: block;}  
  fieldset img {display: block;}  
  fieldset img {input: block;}  
form .formfooter { clear:both; margin: 10px; }  
</style>  
</head>  
<body>  
<form action='#'>  
<fieldset class="spalte1">  
  <p>  
    <label for="f1">F1 lange Beschriftung lange Beschriftung lange Beschriftung lange Beschriftung lange Beschriftung lange Beschriftung :</label>  
    <input type="text" id="f1" name="f1" size="50"/>  
  </p>  
</fieldset>  
  
<fieldset class="spalte2">  
  <p>  
    <label for='bild'>Bild trallala trallala trallala trallala trallala trallala trallala trallala trallala trallala trallala trallala trallala trallala trallala tralla:</label>  
    <input name="bild" id='bild' type="file" size="50" maxlength="100000" accept="text/*"/>  
    <img src='/images/nologo.gif' alt='alt'/>  
  </p>  
  <p>  
    <label for="f11">F11:</label>  
    <input type="text" id="f11" name="f11" size="40" />  
  </p>  
</fieldset>  
  
<div class="formfooter ">  
  <hr/>  
  <input type="submit" value="absenden" name="ok" />  
</div>  
</form>  
</body>  
</html>
Beitrag melden
–
Informationen zu den Bewertungsregeln