Elementos de entrada fluidos
Tengo este formulario ...
<form method="post" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>">
<fieldset>
<legend>Who are you?</legend>
<label for="first-name">First name</label><input type="text" name="first_name" required /><br />
<label for="last-name">Surname</label><input type="text" name="last_name" required /><br />
<label for="email">E-mail</label><input type="email" name="email" required /><br />
<input type="button" name="submit1" id="submit1" value="Next" />
<input type="button" name="clear" id="clear" value="Clear" />
</fieldset>
</form>
Con este CSS ...
form {
margin: 24px 0 0 0;
}
form legend {
font-size: 1.125em;
font-weight: bold;
}
form fieldset {
margin: 0 0 32px 0;
padding: 8px;
border: 1px solid #ccc;
}
form label {
float: left;
width: 125px;
}
form label, form input {
margin: 5px 0;
}
Estoy buscando una manera fácil de hacer que los campos de entrada sean fluidos para que el ancho de los elementos de entrada sea siempre relativo al ancho del elemento del conjunto de campos. En otras palabras, el ancho de la etiqueta (125 px) y el elemento de entrada siempre debe ser el 100% del ancho del elemento del conjunto de campos. ¿Hay una manera fácil de hacer esto (sin agregar divs)?