Hola a todos. Tengo unas dudas en un formulario que estoy haciendo. a ver si me podeis echar una mano. Decir que lo optimizo para firefox, no sé que tal correrá en otros navegadores. Mis dudas son:
1. Cómo puedo hacer para que el input text de
"pais de procedencia" quede centrado de altura y con una altura de una fila en vez de una altura igual a todo el recuadro de su izquierda. No sé si me explico bien, disculpad sino lo hago.
2. Las opciones radio en
"numero de hermanos" me salen centradas como yo quiero, pero el texto que las acompaña queda abajo, tampoco sé alinearlo....
3. Me gustaría que en la ultima opcion
"Otros aspectos importantes" aparecieran dos lineas para introducir texto en vez de una
Codigo html
Código:
<!DOCTYPE html PUBLIC>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>UACC/PIAS</title>
<link href="style2.css" media="screen" rel="StyleSheet" type="text/css">
</head>
<body>
<form id="form1" method="post" action=""><fieldset><legend>VARIABLES SOCIODEMOGRAFICAS
Y FISICAS</legend>
<br><label for="id">ID</label><input name="id" MAXLENGTH="4" type="text"/><br /><br>
<label for="nombre">Nombre</label><input name="nombre" type="text" id="nombre" /><br />
<label for="apellido">Apellido</label><input type="text" name="apellido" id="apellido" /><br />
<label for="nombre2">Nombre2</label><input type="text" name="nombre2" id="nombre2" /><br />
<label for="apellido2">Apellido2</label><input type="text" name="apellido2" id="apellido2" /><br />
<label for="alias">Alias</label><input type="text" name="apellido" id="alias" /><br />
<label for="alias2">Alias2</label><input type="text" name="nombre2" id="alias2" /><br />
<label for="alias3">Alias3</label><input type="text" name="apellido2" id="alias2" /><br />
<labelradio>Sexo</labelradio>
<select name="sexo">
<option> </option>
<option value="1" selected>Hombre</option>
<option value="0">Mujer </option></select><br>
<label2 for="pais">Pais de procedencia</label2>
<input type="text"name="pais"id="pais"/><br>
<label2 >Numero hermanos</label2>
<input type="radio" name="numhe"value="Casado">Sin hermanos
<input type="radio" name="numhe" value="1">1
<input type="radio" name="numhe" value="1">2
<input type="radio" name="numhe" value="1">3
<input type="radio" name="numhe" value="1">4
<input type="radio" name="numhe" value="1">>4<br>
<label2 for="aspecto_fisic">Otros aspectos importantes</label2>
<input type="text" name="aspecto_fisic"rows="3">
</fieldset>
</form>
</body>
</html>
Codigo css
Código:
#form1 label {
width: 100px;
height: 1.2em;
display: block;
float:left;
background-color: #E8EBEC;
padding:2px;
margin:1px;
cursor:pointer;}
#form1 labelradio {
width: 100px;
height: 1em;
display: block;
float:left;
background-color: #E8EBEC;
padding:2px;
margin:1px;
cursor:pointer;}
#form1 label2 {
width: 100px;
height: 2.5em;
display: block;
float:left;
background-color: #E8EBEC;
padding:2px;
margin:1px;
cursor:pointer;}
#form1 label:hover {
background-color: #DCE1E2;
cursor:pointer;}
#form1 label2:hover {
background-color: #DCE1E2;
cursor:pointer;}
#form1 labelradio:hover {
background-color: #DCE1E2;
cursor:pointer;}
#izquierda{
background-color:#BDD2EF;
float:left;
width:10%;
}
#derecha{
height:50%;
background-color:#DAF7E2;
float:right;
width:90%;}
input,select{
font-family: "Trebuchet MS", Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
width:70%;}
input[type=checkbox] {width:auto; }
input[type=radio] {width:auto;}
input[name=id] {width:60px;}
select[name=sexo] {width:80px;}
input[name=pais]{
width: 30em;
height: 3em;}
input[name=orsex]{height: 2.5em;}
input[name=numhe]{height: 2.5em;line-height:2.5em;}
radio[name=numhe]{height:2.5em;}
input[name=aspecto_fisic]{
height: 3em;}
fieldset{
float: left;
width: 80%;
display: block;
background-color: #99c8cc;
}
legend{
text-align:left;
font-weight:bold;}
body {
font-family: "Trebuchet MS", Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
}
Gracias de antemano por vuestra ayuda