2012-10-09 21 views
40

Tengo una entrada de texto, estoy usando html5, en cromo, y quiero cambiar el aspecto de una entrada de texto, he eliminado el esquema en el enfoque (naranja en cromo), I establezca 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.eliminar sombra interna de entrada de texto

Ocurre en Chrome, es decir, y Firefox, no puede probar ninguna otra.

Respuesta

80

border-style:solid; anulará el estilo inset. Que es lo que preguntaste

border:none eliminarán 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, el ancho, el estilo y el color.

Ejemplo: https://jsbin.com/quleh/2/edit?html,output

+3

La primera línea, 'border-style: solid', es la mejor respuesta a esta pregunta. – charleslparker

+0

border-style: ninguno fue la respuesta que estaba buscando –

17

Agregue border: none o border: 0 para eliminar el borde, o border: 1px solid #ccc para hacer el borde delgado y plano.

Para retirar el relleno fantasma en Firefox, puede utilizar ::-moz-focus-inner:

::-moz-focus-inner { 
    border: 0; 
    padding: 0; 
} 

Ver live demo.

+0

cuando hago esto que no tiene borde, sí, pero cuando me puse la frontera de 1px y establecer el color a negro solamente se establecen dos lados. El otro es blanco – FabianCook

8

Establezca border: 1px solid black para igualar todos los lados 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.

+0

Si ajusto el borde a cualquier otro color, digamos #eee, solo se siguen configurando dos lados – FabianCook

+0

Mira mi actualización. Es posible que deba cambiar el estilo y el tamaño del borde también, a 'sólido' y' 1px'. –

+0

Gracias. Yo he basado el tuyo así que sí. – FabianCook

16

Ninguno de la solución están trabajando actualmente. Aquí está mi solución. Puedes agregar prefijos.

box-shadow: inset 0px 0px 0px 0px red; 
+1

Esa es la única solución que actualmente funciona – andreaem

0

Estoy trabajando en firefox. y estaba teniendo el mismo problema, el texto del tipo de entrada se define automáticamente, algo se parece al recuadro de sombreado, pero no es así. el que desea cambiar es el borde ... simplemente estableciendo border:0; y listo.

Cuestiones relacionadas