input type="radio" background bild geben

[kayyy]

hi leute,

ich habe folgendes problem, unzwar wird das bg bild nicht angezeigt, sondern der normale radio button.

hier mein input

<input class="input_poll" type="radio" name="vote" value="$n" />

und in der css habe ich folgendes stehen

div#poll input.input_poll {
background:url(../images/poll_button.png) no-repeat;
width:21px;
height:22px;
}

der bild pfad ist korrekt, habe ich irgendwas falsch gemacht? kann ich dem radio button überhaupt ein bg bild geben?

 

[Bernhard]

kann ich dem radio button überhaupt ein bg bild geben?

Hallo kay,

das wird zumindest nicht in allen Browsern hinhauen:
http://www.css4you.de/wsradio/index.html

Grüße
Bernhard

 

[kayyy]

danke für den link, allerdigns steht da nichts von background images.

ist es denn möglich sowas browserübergreifend irgendwie darzustellen?

 

[Efchen]

Warum nimmst Du nicht einfach einen Link (<a>) und passt das Aussehen wie gewünscht an? Das geht browserübegreifend.

 

[kayyy]

das verstehe ich nicht ganz.

<a><input /></a> ?

 

[Efchen]

Ehm...ich sagte Link, nicht Eingabefeld.

<a href="hastenichgesehn.html">Link</a>

Das AUssehen setzt Du wie gewünscht mit CSS fest.

 

[neuroleptika]

danke für den link, allerdigns steht da nichts von background images.

ist es denn möglich sowas browserübergreifend irgendwie darzustellen?

Du könntest eine Grafik über den Button schieben.
Aktivieren könnte man den Button dann nur noch über <label>.
Ohne Javascript kann der Benutzer dann aber nicht mehr erkennen welchen Radiobutton er markiert hat.
Ich würde den Button einfach so lassen wie er ebend ist.

 

[kayyy]

Ehm...ich sagte Link, nicht Eingabefeld.

<a href="hastenichgesehn.html">Link</a>

Das AUssehen setzt Du wie gewünscht mit CSS fest.

was soll ich denn mit <a>?
ich brauche ein input type="radio", kein <a>


@neuroleptika: er soll allerdings nicht so bleiben wie er ist :)

 

[Asterixus]

Dann beschreibe uns anhand eines Bildes wie es VORHER und NACHHER aussehen soll, weil ich verstehe das nicht.

 

[kayyy]

hat sich nun erledigt, ich habe das ganze mittels eines jquery plugins gelöst

Plugins | jQuery Plugins