Restablecer estilos para elementos de entrada y restyling para devolver el aspecto predeterminado
Tengo un campo de entrada simple.
<input name="1" onfocus="this.value=''" type="text" size="20" value="input 1" title="Enter your search here" />
Debido a que los diferentes navegadores agregan diferentes cantidades de relleno, margen y borde, tengo que restablecerlo de la siguiente manera.
input
{
padding: 0;
margin: 0;
border: 0;
border: none;
}
Ahora tengo unstyled (dejando otras propiedades como el tamaño de fuente o el cursor solo para el movimiento) y quiero recuperar el aspecto que estaba predeterminado antes del restablecimiento pero con valores constantes para que tanto el aspecto como las dimensiones sean iguales en todos los navegadores. hago
input
{
border: 1px inset #F0F0F0;
}
Sin embargo, cambia algo y el aspecto no es el mismo que en este violín donde la primera entrada (entrada 1) no se ha restablecido con la propiedad de borde mientras que la segunda entrada (entrada 2) se ha restablecido (borde: 0; borde: ninguno ;) y nuevamente rediseñado (borde: inserción de 1px # F0F0F0;).
¿Cómo puedo recuperar el mismo aspecto después de aplicarle un estilo para restablecerlo?