Ver Mensaje Individual
  #7 (permalink)  
Antiguo 17/03/2008, 08:06
Avatar de neodani
neodani
 
Fecha de Ingreso: marzo-2007
Mensajes: 1.811
Antigüedad: 17 años, 8 meses
Puntos: 20
Re: Formulario de tablas a css (ayuda)

Muchas gracias Eourus!

Ya estoy mas cerca de conseguir aspecto del formulario.

contactar.php
Código HTML:
<div id="form_contactar">
	<form action="#" method="post" name="form_contactar">
		<fieldset>
		<legend></legend>
	
			<label for="nombre">* Nombre:</label>
			<input type="text" name="nombre" id="formnombre" size="40" tabindex="5"/>
			<br />
			
			<label for="correo">* Correo electrónico:</label>
			<input type="text" name="correo" id="correo" size="40" tabindex="6"/>
			<br />
			
			<label for="pais">* Pais:</label>
			<input type="text" name="apellidos" id="pais" size="40" tabindex="7"/>
			<br />
			
			<label for="asunto">* Asunto del Mensaje:</label>
			<input type="text" name="asunto" id="asunto" size="40" tabindex="8"/>
			<br />
			
			<label for="comentario">* Comentario:</label>
			<textarea name="texto" rows="5" cols="29" class="textcomentario" tabindex="9"></textarea>
			<br />
			
			<input class="boton_enviar" type="submit" name="enviar"  value="Enviar" />
		</fieldset>
		
		<br />
		<fieldset>
	</form>
</div> <!-- Fin formulario --> 
estilo.css

Código HTML:
#form_contactar { font:12px arial; width:500px;}
#form_contactar { margin:0px; padding:0px; }
#form_contactar fieldset { }
#form_contactar legend { }
#form_contactar label { font-weight:normal; display:block; width:150px; float:left; }
#form_contactar input, select { 
color:#333333;
border-color:#A5ACB2 rgb(227, 232, 237) rgb(227, 232, 237) rgb(165, 172, 178);
border-width:1px;
border-style:solid;
height:18px;
width:150px;
font-size:11px;
padding:2px 5px 0px 10px;
margin:7px 5px 5px 5px;
background-color: #F7F4FF;
}
#form_contactar textarea { 
color:#333333;
border-color:#A5ACB2 rgb(227, 232, 237) rgb(227, 232, 237) rgb(165, 172, 178);
border-width:1px;
border-style:solid;
width:300px;
font-size:12px;
padding:2px 5px 0px 10px;
margin:7px 5px 5px 5px;
background-color: #F7F4FF;
}
#form_contactar textarea:focus { background-color: #ECF0FF;}
#form_contactar input:focus, select:focus  { background:#ECF0FF;}
#form_contactar br { display:block; margin-bottom:5px; clear:both; }

#form_contactar .boton_enviar{
background-color:#418FC2;
border:medium none;
color:#FFFFFF;
font-weight:bold;
padding:2px 7px 1px;
width:60px;
height:25px;
float:right;
}

No consigo que el texto de la etiqueta LABEL quede centrado verticalmente respecto al input, me queda arriba del todo.

Sabes como hacerlo?

ARREGLADO: he puesto un padding-top al label y me lo situa donde quiero


Y otra pregunta para que sirve el size="40" de los inputs?
En teoria es el tamaño de la caja no? pero si ya le doy un valor width de 150px , realmente me sirve de algo el size="40"?

Y por último el efecto focus se me ve de lujo en firefox pero en IE no funciona. No hay solución?

Gracias por todo!

Edito: Sigo teniendo la duda del size y pq no se ve en IE el focus

Última edición por neodani; 17/03/2008 a las 08:30