css - medio - etiqueta border html

Firefox 4 Entrada requerida Forma RED borde/esquema

Question

Recientemente he desarrollado un complemento jQuery HTML5 y tengo problemas para eliminar el borde rojo en los campos obligatorios en FF4 beta.

Noté que FF aplica este borde / contorno en los campos obligatorios y lo elimina cuando se establece el valor. El problema es que estoy usando el atributo de valor para emular el marcador de marcador de posición en navegadores más antiguos. Por lo tanto, necesito todas las entradas con esta característica para no mostrar la línea roja.

Puede ver el problema en la página de demostración del complemento aquí

Answer 1

Envuelva su input requerida en un form con el atributo novalidate

<form novalidate>
    <input required>
</form>

Answer 2

Para ser más específico, necesita aplicar ese estilo al control de entrada.

input:invalid {
    box-shadow: none;
}

Answer 3

Por favor, intente esto,

$ ("formulario"). attr ("novalidate", verdadero);

para su formulario en su archivo global .js o en la sección de encabezado.

Answer 4

usa este código como solución rápida y simple

:invalid {
  box-shadow: none;
}

:-moz-submit-invalid {
  box-shadow: none;
}

:-moz-ui-invalid {
  box-shadow:none;
}

Referencia: https://developer.mozilla.org/en-US/docs/Web/CSS/:invalid

Answer 5

Hay algunos pseudo selectores nuevos para algunas de las nuevas funciones de formularios HTML5 disponibles para usted en CSS. Probablemente estés buscando :invalid . Los siguientes son todos de los documentos de MDC Firefox 4 :

• La :invalid CSS :invalid se aplica automáticamente a los elementos cuyos contenidos no se pueden validar de acuerdo con la configuración del tipo de entrada

• La :-moz-submit-invalid se aplica al botón de envío en los campos de formulario cuando uno o más campos de formulario no se validan.

• La pseudo-clase :required ahora se aplica automáticamente a los campos que especifican el atributo requerido; the :optional pseudo-class :optional se aplica a todos los demás campos.

• Se ha agregado la pseudo-clase :-moz-placeholder , para permitirle estilo al texto del marcador de posición en los campos del formulario.

• El pseudo-selector de :-moz-focusring permite especificar la apariencia de un elemento cuando Gecko cree que el elemento debe tener una indicación de enfoque representada.