App Academy

HTML/CSS Assessment "pet_name" Issue

Apparently I made one mistake in my HTML code for this part of the assessment, but I can’t figure out what I did wrong.

Here is App Academy’s error message:

"The questions you missed were:

[has exactly one input with a name of ‘pet_name’ and an associated label with the content ‘Name’ ] "

Here is my code…what is the issue? I created an input with the associated label “name”, with the content “Name”, and a name of “pet_name”…

  <div>
    <label for="Name">Name</label>
    <input type="text" name="pet_name">
  </div>

  <div>
    <label for="type">Type</label>
    <select id="type" name="pet_type">
      <option value="cats">Cat</option>
      <option value="dogs">Dog</option>
      <option value="hamsters">Hamster</option>
      <option value="zebras">Zebra</option>
      <option value="other">other</option>
    </select>
  </div>

  <div>
    <label for="pet_bio">Biography</label>
    <textarea id="bio" name="bio"></textarea>
  </div>

  <div>
    <label for="pet_owner_email">Owner's Email</label>
    <input type="email" id="owner-email" name="pet_ownder_email">
  </div>

  <div>
    <button id="new-pet-submit-button" type="submit">Create new pet</button>
  </div>

  <div>
    <button type="reset">Reset</button>
  </div>

</fieldset>

Welcome and thanks for posting! :wave:

The instructions ask for you to:
Screen Shot 2020-12-27 at 5.58.32 PM

Looks like you’re missing your id, which you did a nice job of including for “type”! Capitalization matters here, so take a look at your label, add a matching id, and make sure it 100% matches the instructions.

On that note - you may want to tweak your pet options to match the instructions and have a close look at the name of pet owner email! It’s very important to catch typos, even if it cleared that piece of the assessment.

Thanks! I made the following edit but unfortunately still did not pass…I’m unclear on what the error is.

Name
  <div>
    <label for="type">Type</label>
    <select id="type" name="pet_type">
      <option value="cat">Cat</option>
      <option value="dog">Dog</option>
      <option value="hamster">Hamster</option>
      <option value="other">Other</option>
      <option value="zebra">Zebra</option>
    </select>
  </div>

Based on your original code above, there’s a couple errors:

  1. Capitalization issue with label for=Name
  2. There is no id that matches the label (capitalization counts too)

Hoping this gives you a hint!

1 Like