[SOLUCIONADO] Como arreglo este botón de formulario

[Martine]

Hola, no estoy seguro de que esta sea el área correcta para mi pregunta.

En el siguiente sitio web verán un formulario de registro horizontal (en el encabezado debajo del menú).

La cosa es que el botón de envío (Quiero El Reporte!) se ve bien en Google Chrome pero adivinen que? ... sip, en IE se ve mucho mas alto de lo regular.

De antemano gracias por sus sugerencias para solucionarlo:

http://www.vivianasanchez.com/

[Triby]

Muevo tu tema desde PHP a CSS.

[herzbazi]

Iniciado por Martine

Hola, no estoy seguro de que esta sea el área correcta para mi pregunta.

En el siguiente sitio web verán un formulario de registro horizontal (en el encabezado debajo del menú).

La cosa es que el botón de envío (Quiero El Reporte!) se ve bien en Google Chrome pero adivinen que? ... sip, en IE se ve mucho mas alto de lo regular.

De antemano gracias por sus sugerencias para solucionarlo:

http://www.vivianasanchez.com/

hola como estas? no soy muy bueno en esto jajaaj pero algo puedo aportar creo

si te das cuenta en FORM-viv_form Button tienes un padding-top:
de 7px !important; esto quitalo

asi como en la clase viv-form 0L LI tienes un line-height: 37px; quitalo tambien o comentalo como quieras

si eliminas estos dos que te digo queda igual que en chrome
y despues ya mira el texto Recibe Gratis "Mentalidad de Éxito" que al quitar line.height se sube un poco.

me cuentas espero haberte ayudado

[Martine]

Hola herzbazi, muchas gracias !

Aunque no me funcionó exactamente como lo recomendaste, si me sirvió de pista para saber por donde ir. Ahora lo veo bien en IE y en Chrome.

Esto fue lo que hice:

.viv_form ol li {
display: inline-block;
vertical-align: middle;
padding-right: 6px;
line-height: 20px;
height: 37px;
}

Luego

form.viv_form button,form.viv_form .buttons a.link {
background: #6a406a;
background: -moz-linear-gradient(top, #ffffff 0%, #ae79ae 0%, #865186 50%, #6a406a 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(0%, #ae79ae), color-stop(50%, #865186), color-stop(100%, #6a406a));
background: -webkit-linear-gradient(top, #1e5799 0%, #ae79ae 0%, #865186 50%, #6a406a 100%);
background: -o-linear-gradient(top, #ffffff 0%, #ae79ae 0%, #865186 50%, #6a406a 100%);
background:-ms-linear-gradient(top, #ffffff 0%, #ae79ae 0%, #865186 50%, #6a406a 100%);
background:linear-gradient(to bottom, #ffffff 0%,#ae79ae 0%,#865186 50%,#6a406a 100%);
color: #ffffff;
font-size: 15px;
-webkit-border-radius: 9px;
-moz-border-radius: 9px;
border-radius: 9px;
border: 2px solid #753a75;
padding: 5px 10px !important;
cursor: pointer;
font-weight: bold;

Y finalmente el texto recibe Gratis "Mentalidad de Exito" lo escribí así directamente en el documento:

<div class="signup_form-home"> <!--Comienza Getresponse-->
<style>
li span { line-height: 37px; }
</style>
<form class="viv_form" accept-charset="utf-8" action="https://app.getresponse.com/add_contact_webform.html?u=BiMs" method="post">
<ol>
<li><strong><em><span>Recibe Gratis "Mentalidad de &Eacute;xito"</span></em></strong></li>
<li><input id="nombre" name="nombre" class="newtext" placeholder="*Primer Nombre" value="" type="text"></li>
<li><input id="email" name="email" class="newtext" placeholder="*Email" value="" type="text"></li>
<li class="buttons"><button type="submit" name="submit" value="1">QUIERO EL REPORTE! &raquo;</button></li>
</ol>
<input type="hidden" name="webform_id" value="2180303" />
</form>
</div>