HTML/Assessment Question

I just received my results for the first assessment and these were the three areas I missed:

  • has a ‘form’ element that is 600px when the window is wider than 600px

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

  • has exactly one ‘select’ element with a name of ‘pet_type’ and an associated label with the content ‘Type’

I’ve reworked them but would appreciate any feedback before resubmitting

Screenshot 2021-01-01 200940


I completed this assessment a few weeks ago.

I’m not completely sure how you approached the rest of the css styling for your form so if you could post more of your code that would be super helpful for breaking this down more. I did it by using a media query for when the screen/window is 600px or wider and then another for when it’s under 600 px. Then I implemented styling ie form width etc for each depending on what size the window is. Just google “media queries for width of screen” and there will be easy examples to model after.

For the second two problems, which seem pretty similar, it’s mostly about making sure you have exactly what they ask for in your html. Again it would be helpful to see this code to pinpoint where the error occurred if it was something left out or spelled wrong. Make sure your caps/underscores are all in the right places.

1 Like

Thanks so much for responding! I think I’ve addressed the ‘pet name’ and ‘type’ issues, but I’m still unsure about the form element. Here are some more screenshots.

Of course! So for the form we definitely classified things a little differently–I’m not sure what nav is or what’s nested under that in your html. For mine, I nested everything that was inside of the box of the form inside the media query so the form, the input options, the buttons, etc. And then the only things that weren’t nested under the media queries in the css were the things for the card below. This made it so that anytime I changed the size of the screen, everything inside of the form box would respond accordingly. Basically I’m confused why you have your form styling outside the media queries. There’s definitely different ways to accomplish this so if it works it works, but I would just make sure it responds the way they say it should when you resize the window. Happy to look at more code though if you want more help.

I should’ve looked at your code more closely. I don’t think you need to do anything with the nav (at least I didn’t and it was fine). I would just put your form and then elements in your form under the media query like form, label, select, textarea. And then give them the corresponding styling in each query so that they behave the way the instructions ask.

Good morning, and Happy New Year!

It looks like @ssmall1 has shared some ideas on how to tackle the form width.

For the pet_name and pet_type issues, you will need to be super careful about how you set up and associate each label with the input. Make sure that your spelling and capitalization matches the directions exactly. I would recommend reviewing the lesson here when you double-check that section.

Let us know how it goes when you re-submit!