pimbolie1979
Mitglied
Hallo Leute,
ich habe bereits im Internet nach der Formatierung von Checkboxen gesucht und auch einige gefunden. Jedoch haben auch alle so ihre Nachteile z.B. das es nicht beim IE8 unter Windows XP funktioniert , oder es muss CSS3 unterstützt werden.
Ich habe mich jetzt für die Sprite Variante entschieden und möchte diese auch verwenden. Meine Umsetzung funktioniert auch schon FAST perfekt, jedoch leider nur fast :-). Deshalb benötige ich Eure hilfe, denn ich habe schon sehr viel ausprobiert, jedoch hat dies alles nichts gebracht.
Hier ein Link zu meiner Seite:
http://www.gastgeber-deutschland.de/vermieterbereich/ansprechpartner.php
Ist die Checkbox angeklick sieht diese auch richtig formatiert aus, jedoch wenn die Checkbox nicht angeklickt ist werden alle 3 Bilder vom Sprite-Image dargestellt. Dies soll natürlich nicht so sein, sondern es soll nur die Checkbox ohne Haken dargestellt werden.
Hier meine CSS Code:
input[type="checkbox"]
{
display: none;
overflow: hidden;
}
input[type="checkbox"] + label
{
width: 30px;
height: 30px;
display: block;
background-image: url(../bilder/checkbox.png);
background-position: 0px 0px;
background-repeat: no-repeat;
cursor: pointer;
padding-left: 100px;
}
input[type="checkbox"]:checked + label
{
background-position: -60px 0px;
}
Hier der HTML Code:
<input type="checkbox" name="sprache_deutsch" id="checkbox" value="checkbox"><label for="checkbox">deutsch</label>
Es wäre schön wenn mir einer helfen könnte um dies Problem endlich zu lösen, so das ich weitermachen kann.
ich habe bereits im Internet nach der Formatierung von Checkboxen gesucht und auch einige gefunden. Jedoch haben auch alle so ihre Nachteile z.B. das es nicht beim IE8 unter Windows XP funktioniert , oder es muss CSS3 unterstützt werden.
Ich habe mich jetzt für die Sprite Variante entschieden und möchte diese auch verwenden. Meine Umsetzung funktioniert auch schon FAST perfekt, jedoch leider nur fast :-). Deshalb benötige ich Eure hilfe, denn ich habe schon sehr viel ausprobiert, jedoch hat dies alles nichts gebracht.
Hier ein Link zu meiner Seite:
http://www.gastgeber-deutschland.de/vermieterbereich/ansprechpartner.php
Ist die Checkbox angeklick sieht diese auch richtig formatiert aus, jedoch wenn die Checkbox nicht angeklickt ist werden alle 3 Bilder vom Sprite-Image dargestellt. Dies soll natürlich nicht so sein, sondern es soll nur die Checkbox ohne Haken dargestellt werden.
Hier meine CSS Code:
input[type="checkbox"]
{
display: none;
overflow: hidden;
}
input[type="checkbox"] + label
{
width: 30px;
height: 30px;
display: block;
background-image: url(../bilder/checkbox.png);
background-position: 0px 0px;
background-repeat: no-repeat;
cursor: pointer;
padding-left: 100px;
}
input[type="checkbox"]:checked + label
{
background-position: -60px 0px;
}
Hier der HTML Code:
<input type="checkbox" name="sprache_deutsch" id="checkbox" value="checkbox"><label for="checkbox">deutsch</label>
Es wäre schön wenn mir einer helfen könnte um dies Problem endlich zu lösen, so das ich weitermachen kann.