Representación extraña del botón de envío de CSS en iPad / iPhone

Respuestas:

453

¡Uy! acabo de encontrarme: simplemente agregue esta línea en cualquier elemento que necesite

   -webkit-appearance: none;
Francesco
fuente
23
te amo, stackoverflow y @Francesco
jahrichie
28
Brillante, y aquí hay un gran artículo al respecto de trucos de CSS. Enumera todos los demás elementos modificados por WebKit y Mozilla.
Patrick
Compass tiene una mezcla para esto también compass-style.org/reference/compass/css3/appearance
Patrick Beeson
1
Desearía haber hecho esta búsqueda en Google hace 12 horas ... GRACIAS.
Elly Post
1
¡Realmente grandioso! ¡No pensé que este tipo de problema también ocurriera en iOS! ¡Una vez más, muchas gracias por esto!
Saurabh Prajapati
36

Agregue este código al archivo css:

input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

Esto ayudará.

subindas pm
fuente
1
¡Excelente! Formar botón de enviar ahora se ve como debería en mi iPad
peterkodermac
1
@peterkodermac, no olvide agregar la clase CSS principal, de lo contrario, esto puede afectar a todos los campos de entrada.
subindas pm
4

La respuesta anterior para la apariencia del kit web hizo la magia, pero el botón todavía se veía pálido / aburrido en comparación con el navegador en otros dispositivos / escritorio. También tuve que establecer la opacidad a completa (rangos de 0 a 1)

-webkit-appearance:none;
opactiy: 1

Después de configurar la opacidad, el botón se veía igual en todos los diferentes dispositivos / emulador / escritorio.

Priyank Thakkar
fuente