Check Radio Buttons and Checkboxes by Defaultt

1

Tell us what’s happening:
1st chechbox got checked but 1st radio button didn’t.
i have added the checked attribute for both but still.
hwo to get the 1st radio button to be checked ?

Your code so far

<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }

  .smaller-image {
    width: 100px;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>

<p>Click here for <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back. " src="https://bit.ly/fcc-relaxing-cat"></a>

<p>Things cats love:</p>
<ul>
  <li>cat nip</li>
  <li>laser pointers</li>
  <li>lasagna</li>
</ul>
<p>Top 3 things cats hate:</p>
<ol>
  <li>flea treatment</li>
  <li>thunder</li>
  <li>other cats</li>
</ol>
<form action="/submit-cat-photo">
  <label><input type="radio" name="test-name" value="checked"> Indoor
  </label>
  
  <label><input type="radio" name="indoor-outdoor"> Outdoor</label>
    <!--<input type="radio" name="test-name" checked>-->

  <label><input type="radio" name="test-name" checked> Loving </label>
  <label><input type="checkbox" name="personality"> Lazy</label>
  <label><input type="checkbox" name="personality"> Energetic</label>
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
</form>

Your browser information:

Your Browser User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.100 Safari/537.36.

Link to the challenge:
https://www.freecodecamp.org/challenges/check-radio-buttons-and-checkboxes-by-default

2

The challenge ask you to

Set the first of your radio buttons and the first of your checkboxes to both be checked by default.

This means that the checked property needs to be added to indoor radio and loving checkbox.

Also mind how you add the checked property:

value="checked"> Indoor

Does not means that the radio will be checked, but that once is, its value returned will be "checked" (string checked)

Hope it helps :+1:

3