Básicamente jugando con float:left; y display:block, para los elementos label y dejando de lado los inputs.
El código html sería el siguiente:
<div id="contacto">
<form id="Form" action='mailform.php' method='post' onsubmit="return checkform(this)">
<fieldset>
<legend>Contacto</legend>
<label for="nombre" class="nombre">Nombre</label>
<input id="nombre" class="borde" name="nombre" value="" maxlength="100" type="text" /> <br />
<label for="email" class="" email">Email</label>
<input id="email" class="borde" name="email" value="" maxlength="100" type="text" /> <br />
<label for="telefono" class="telefono">Teléfono</label>
<input id="telefono" class="borde" name="telefono" value="" maxlength="100" type="text" /> <br /><br />
<label for="mensaje" class="mensaje">Mensaje</label>
<textarea id="mensaje" class="borde" name="mensaje" cols="58" rows="8"></textarea><br />
<input id="Submit" name="contact_submit" value="Envía" type="submit" />
</fieldset>
</form>
</div>
y parte del css requerido sería este:
form fieldset label{
margin-top:2px;
display: block;
float: left;
text-align: left;
width:70px;
/*border:1px solid #11aa33;*/
font-size:13px;
height:10px;
}
Hay una web que trata bastante más profusamente el tema: form two columns
No hay comentarios:
Publicar un comentario