Anwenden Grenze für eine checkbox in Chrom

Ich habe eine Menge von Formen auf meiner website, mit, natürlich, viele der Felder in Ihnen erforderlich ist. Wenn erforderliches Feld leer gelassen wird, erhält er einen 'Fehler' Klasse und ich bin versucht zu umkreisen das Feld in rot-unabhängig davon, ob es ein Textfeld, drop-down-Menü oder eine checkbox.
Ich habe den folgenden code in meine css-Datei:

.error input, .error select, .error textarea {
    border-style: solid;
    border-color: #c00;
    border-width: 2px;
}

Nun merkwürdig genug, dass funktioniert auch im IE, aber in Chrome die checkbox nicht rot eingekreist kann ich zwar sehen, dass die CSS angewendet wird, um Sie bei der überprüfung des Elements.

Das mag irrelevant sein, bei dem css-code oben ist aktiv, aber ich habe etwas anderes in meiner css-Datei:

input[type=checkbox] {
    background:transparent;
    border:0;
    margin-top: 2px;
}

Ist und verwendet wird, so dass die Checkboxen werden korrekt angezeigt, im IE8 und kleiner.

Irgendwelche Ideen, wie ich das visualisieren kann die rote Umrandung in Chrom?

BEARBEITEN:
Hier ein jsfiddle:
http://jsfiddle.net/PCD6f/3/

InformationsquelleAutor mmvsbg | 2013-07-17
Schreibe einen Kommentar