css with radio buttons

Discussion in 'CSS' started by Funk-woo10, Apr 16, 2008.

0
  1. #1
    Hi all,

    what is the best way I can use css to highlight radio boxes when the mouse hovers over or selects the button ?

    I could probably use JS but css would be nice !

    thanks.
     
    Funk-woo10, Apr 16, 2008 IP
  2. Kirkbride

    Kirkbride Peon

    Messages:
    40
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Try giving each radio button a class, and then use the CSS hover psuedo class on them.

    So your HTML would look something like this:

    <input class="yourclass" type="radio" name="test" value="1" /> One<br />
    <input class="yourclass" type="radio" name="test" value="2" /> Two<br />

    And your CSS would look something like this:

    input.yourclass:hover {
    background: #f00;
    }

    It might not work in all browsers (I'm looking at you IE6), but it might be your only option with CSS.
     
    Kirkbride, Apr 16, 2008 IP