Test Foro de elhacker.net SMF 2.1

Programación => Desarrollo Web => Mensaje iniciado por: NathanD en 22 Septiembre 2014, 20:52 PM

Título: ¿Cómo alinear elementos de formulario por bloques como en la imagen? HTML/CSS
Publicado por: NathanD en 22 Septiembre 2014, 20:52 PM
Buenas, llevo bastante tiempo dándole vueltas a cómo hacer lo de la siguiente imagen, y la verdad es que no tengo ni idea.

(http://i.imgur.com/otEunvB.png)

No pongo el código porque básicamente es inútil, mi problema es el concepto.

Estaría muy agradecido si me ayudarais aunque fuera a plantearlo.
Título: Re: ¿Cómo alinear elementos de formulario por bloques como en la imagen? HTML/CSS
Publicado por: DaNuK en 22 Septiembre 2014, 21:05 PM
no te entiendo a que te refieres con concepto, lo que intentas hacer ya es cuestion de diseño y para lograrlo necesitas usar css
Título: Re: ¿Cómo alinear elementos de formulario por bloques como en la imagen? HTML/CSS
Publicado por: NathanD en 22 Septiembre 2014, 21:24 PM
Pues a si tengo que agrupar los elementos con divs, párrafos, qué grupos hacer, cómo hacer la alineación...

Gracias por responder.
Título: Re: ¿Cómo alinear elementos de formulario por bloques como en la imagen? HTML/CSS
Publicado por: DaNuK en 22 Septiembre 2014, 22:15 PM
tan facil como hacer esto
Código (html4strict) [Seleccionar]

<form action="" id="frm">
<legend>Mi formulario</legend>
<div class="controles">
<label for="">etiqueta 01</label>
<input type="text">

</div>
<div class="controles">
<label for="">etiqueta 02</label>
<input type="text">

</div>
<div class="controles">
<label for="">etiqueta 03</label>
<input type="text">

</div>
</form>



css
Código (css) [Seleccionar]

.controles label, .controles input
{
display:inline-block;
vertical-align:top;
}
.controles input
{
margin-left:30px;
width:250px;
}
.controles label
{
font-family:monospace;
}
legend
{
font-weight:bold;
font-family: monospace;
}


Saludos
Título: Re:
Publicado por: onStrike en 23 Septiembre 2014, 20:12 PM
Crack ^