radio button

Question

Hi, I am taking a code challenge to change color and font-weight to bold on the radio button. It said wrong.

Did my code have problems?

Thanks

index.html

<!DOCTYPE html>
<html>
<head>
    <title>UI Element States Pseudo-Classes</title>
    <link rel="stylesheet" type="text/css" href="page.css">
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
    <body>
        <form>
            <label>Name:</label>
            <input type="text">
            <label>Phone:</label>
            <input type="text" disabled>
            <div>
                <input name="radio" id="radio1" type="radio"><label for="radio1">Option 1</label>
                <input name="radio" id="radio2" type="radio"><label for="radio2">Option 2</label>
            </div>
            <input type="submit" value="Submit">
        </form>
    </body>
</html>

style.css

/* Write your CSS code below */

:disabled {
  background-color: lightgray;
}

input[type="radio"]: checked+label {
  color: blue;
  font-weight: bold;
}

Answer 1 · 2015-01-21T15:10:15Z

January 21, 2015 3:10pm

Hi,

Remove your space between the colon and 'checked':

input[type="radio"]: checked+label {

becomes

input[type="radio"]:checked+label {

That should sort it :)

-Rich

EDIT: I think Wayne Priestley beat me to that one :)

Answer 2 · 2015-01-21T15:08:29Z

January 21, 2015 3:08pm

Hey Edwin,

Your answer is correct, you just have a unwanted space between : checked+label, remove the space and you'll pass

input[type="radio"]:checked+label

Hope this helps.

Welcome to the Treehouse Community

Looking to learn something new?

Edwin Chau

Edwin Chau

radio button

2 Answers

Rich Bagley

Rich Bagley

Wayne Priestley

Wayne Priestley

Edwin Chau

Edwin Chau