Frage zur Gestaltung von Checkbox und Radio Button

allo zusammen,
ich habe folgende frage an euch
wie bekomme ich das so hin?

Den Anhang 13256 betrachten


Den Anhang 13255 betrachten

CSS Anweisung:


.checkbox{
width: 100%;
content:' ';
display:inline-block;
width: 17px;
height:17px;
position: relative;
border: 1px solid #bbb;
background: white;
margin-right: 1em;
box-shadow: inset 0 1px 1px 0 rgba(0,0,0,.1);
}


.checkbox:hover {
background:#ddd;
box-shadow: inset 0 0 0 2px white;
}

.checkbox:active {
background:#000;
background:black;
box-shadow: inset 0 0 0 2px white;
}

Der Rahmen der Checkbox und der Hover geht, aber aktiv geht noch nicht
und die Checkbox wird wie folgt angezeigt:


kann mir hier bitte jemand helfen :razz:

Vielen Dank

 

ich habe das ganze nun in ein pdf: http://wir-ladies-auch.de/images/checkbox_radio.pdf

 

in der pdf
oben siehst du die checkboxen.
darunter die radio buttons

button jeweils normal, dann als rollover, dann wenn dieser aktiv ist.

ganz unten wird z.b. zeige ich, den checkbutton, der mit der css angezeigt wird.
siehe css anweisung.

nun war meine frage, wie muss ich diese css erweitern, dass das ergebnis der darstellung der checkboxen / radio buttons dem entspricht,
wie ich es als grafikbild in der pdf angezeigt habe.

das ist eigentlich alles...:razz: