html - ponerle - eliminar la sombra interna de entrada de texto
sombra interior css (7)
Así que tengo una entrada de texto, estoy usando html5, en Chrome, y quiero cambiar el aspecto de una entrada de texto, #f1f1f1 el contorno en el enfoque (naranja en cromo), establecí el fondo en un color claro #f1f1f1 pero ahora hay un borde más grueso en los lados superior e izquierdo, como si fuera mirado hacia adentro, cuando no hay cambio en el color de fondo esto no sucede. ¿Cómo lo elimino? Lo siento, no puedo proporcionar una imagen, en un dispositivo móvil.
Sucede en Chrome, es decir, y Firefox, no puede probar otros.
Agregar border: none o border: 0 para eliminar el borde, o border: 1px solid #ccc para hacer el borde delgado y plano.
Para eliminar el relleno de fantasmas en Firefox, puedes usar ::-moz-focus-inner :
::-moz-focus-inner {
border: 0;
padding: 0;
}
Esta es la solución para safari móvil:
-webkit-apariencia: ninguno;
como se sugiere aquí: eliminar la sombra interna de textarea en Mobile Safari (iPhone)
Establecer border: 1px solid black para que todos los lados sean iguales y eliminar cualquier tipo de borde personalizado (que no sea sólido). Además, configure box-shadow: none para eliminar cualquier sombra insertada que se le aplique.
Estoy trabajando en Firefox. y yo estaba teniendo el mismo problema, el texto del tipo de entrada se define automáticamente, algo se parece a la inserción de la sombra del cuadro, pero no es así. el que desea cambiar es el borde ... solo establece el border:0; y tu estas listo.
Ninguna solución está funcionando actualmente. Aquí está mi solución. Puedes agregar prefijos.
box-shadow: inset 0px 0px 0px 0px red;
Prueba esto
outline: none;
demostración en vivo https://codepen.io/wenpingguo/pen/KQgbXq
border-style:solid; anulará el estilo de inset . Que es lo que preguntaste
border:none eliminará el borde todos juntos.
border-width:1px lo configurará para que sea como antes de que cambie el fondo.
border:1px solid #cccccc es más específico y aplica los tres, ancho, estilo y color.