HTML HTML Forms Choosing Options Radio Buttons

Isaac Asante
Isaac Asante
4,752 Points

Different layout from the video in my browser

Hi, I'm adding this code but at my end, I'm seeing line breaks after the Age label, each radio buttons and their labels. So each element comes on the next line...

<label>Age:</label>
          <input type="radio" id="under_13" name="user_age" value="under_13"><label for="under_13">Under 13</label>
          <input type="radio" id="over_13" name="user_age" value="over_13"><label for="over_13">13 and above</label>

Is there an error with my code? Thanks!

2 Answers

Jeremy Frimond
Jeremy Frimond
13,998 Points

What browser are you using?

Hi Isaac,

You're seeing all 5 elements each on their own line?

Nick had added a line break <br> after the "Under 13" label so that the 2nd radio button and label would appear on the next line. That's missing from your code and you don't have class="light" for the radio button labels.

I decided to check the css and the omission of the "light" class was the majority of your problem along with not having the <br>

The project uses:

label {
  display: block;
  margin-bottom: 8px;
}

label.light {
  font-weight: 300;
  display: inline;
}

By omitting the "light" class your labels for the radio buttons are not set back to inline