HTML/CSS Assessment Single-Line Text Input, id = "name", name = "pet_name", and label = "Name"

Learning Challenge

HTML/CSS Assessment fail and retry finishing touches

Question

I was told specifically that I got 10/12 for the assessment. I’ve figured out where I went wrong on one of the two mistakes. I can’t seem to get a clear answer on the other issue. The assessment has a requirement which reads as follows:

Blockquote
… has an single-line text input with and id of “name”, a name of "pet_name" , and with an associated label that reads “Name”.

My email report on my outcome says one of the mistakes I made is as follows:

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

From what I can tell, the HTML I’ve pasted is what I’m supposed to be focusing on and it seems correct. Is there something I’m missing? Am I focusing on the wrong part of code in my HTML?

Screenshots

image

Is it possible to paste more of your code? Make sure that you haven’t mistakenly used “pet_name” more than once (it may seem asinine, but I got 11/12 the first submission because I had used “pet_name” in one spot instead of “pet_type”)

Sure @aprilclove! Here ya go. I checked for the error you’re talking about and I think I’m good, but it always helps to have another set of eyes.

take a look at the code in the notepad… look at all of your attributes/labels. Do they align or have any of them been used more than once?

2 Likes

Thank you. I checked all of this. I went through it on notepad several times. I just can’t figure out what I’m missing. I did get the “for” attribute switched from “name” to “type”, but I already knew about that issue. I’m just baffled on this name, pet_name and Name issue for the single-line input. Let’s see what happens. Thank you again.

Hey, I looked back through your code, and I’m not sure if you fixed it already, but there is a discrepancy with your email section as well. (There is a hyphen used in place of an underscore) When you load the browser, what does it look like? Does it display any errors or is the layout not what it should be?

For the name/pet_name issue, what seems to be the continued issue?

I responded to your last post, but I was also wondering about the decision to class your submit button? Your email section of code shows an inconsistency with the ‘owner email’ attribute

@aprilclove Thanks for getting back to me.

I thought the same thing. But if you look at the requirements from the HTML/CSS Assessment page, this is what it shows:

So if it is wrong, that’s on them!!!

It works perfect except that when you click Owner’s Email Label, it doesn’t put the cursor in the field input section like it is supposed to.

I finally got confirmation that there was no issue. I guess I didn’t actually get anything wrong. I just got the assessment back from the second submission and it was 12/12.

Thanks again for all your help and suggestions.

I’m new to coding. I didn’t receive any points off for creating the submit button as a class element. I don’t know if that is not usually done or not, but I can at least infer that it isn’t wrong to do it that way, even if it isn’t the common way to do it. Does that make sense?

I 100% understand; we all will have our own style and fingerprint for our code. I’m so glad you were able to get the assessment passed! Is this the first one you’ve completed? I was advised to start with Boolean Algebra cause it’s considered most difficult.

1 Like

Hi @FullStackJunkie,

I had the same issue!! Did you get one of your missed assessments back?

I had pet_name and pet_type listed as wrong. I want to submit, but I’m nervous to get wrong again.

1 Like

I got the pet_name and pet_type ones wrong specifically, but feel the same way you do. I don’t think anything is wrong can someone else see any errors?

CODE SNIPPET

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>App Academy HTML/CSS Assessment</title>
  <link href="site.css" rel="stylesheet">
</head>

<body>
  <form action="/pets" method="post">

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

    <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>

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

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

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

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

  </form>

  <div class="card">
        <img src="./images/desert.jpg" class="desert" alt="desert photo">
        <img src="./images/person-avatar.jpg" class= "person" alt="person avatar">
      <head>
        <p class="title">Title goes here</p>
        <p class="secondary">Secondary text</p>
      </head>
      <body>
        <p class="body">Greyhound divisively hello coldly wonderfully marginally far upon excluding.</p>
      </body>

  </div>

  <!-- Your markup goes here. -->
</body>

</html>

1 Like

Hey @aprilclove! No, unfortunately I had already started the HTML/CSS Assessment when I got the email about starting with Boolean Algebra. Even though they say Boolean Algebra harder, I have a little familiarity with GIT and moderate familiarity with Boolean Logic so I’m going to get the GIT out of the way because I find it to be a bit more confusing and something I’m sure I’m going to have to spend the most time on.

Of the two which did you find the most difficult?

Hey @ChadCalcote! That’s frustrating. Have you gotten any feedback from the Software Engineers? I would definitely wait to hear from them. From what I can see this in part of your code you are doing everything correctly.

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

<div>
  <label for="type">Type</label>
  <select id="type" name="pet_type">`

The place to worry in the label elements is the “for=” attribute. That should reflect the “id” attribute of the “select” or “id” element we are wanting to be affected (depending on which “div” we are looking at). From what I can tell you have the proper input in the “for=” attribute in both places.

And I really don’t see any issues with your “=name” attributes in either of them.

So like I said, I’d wait for an Engineer to confirm with you. Sorry I couldn’t be of more help…

I completely understand your anxiety my friend. I really did not want to waste another attempt because I have some familiarity with GIT and even though they say it’s simple on the surface, I have a hard time with it, so I need the rests of my attempts for that and maybe even one with Boolean Algebra, even though I enjoy Boolean Logic.