How to create a form element

Nest your text field inside a form element, and add the action="https://freecatphotoapp.com/submit-cat-photo attribute to the form element.


<h2>CatPhotoApp</h2>
<main>
<p>Click here to view more <a href="#">Cat photos</a>.</p>
<form action="/url-where-you-want-to-submit-form-data"></form>
<a href="#"><img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></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>
<input type="text" placeholder="cat photo URL">
</main>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.135 Safari/537.36.

Challenge: Create a Form Element

Link to the challenge:

Hi, if you read the instructions, it asks you to " Nest your text field inside a form element".
You need to move the form element down the page and wrap it around the element.
Don’t forget to add the action attribute to the form as well and use the correct url.

1 Like

Hey there,

nice to meet you! :wave:


So this is your start code:

<input type="text" placeholder="cat photo URL">

The first step is Your text input element should be nested within ...

Nesting means:

<outer>
  <input type="text" placeholder="cat photo URL">
</outer>

The second step is Your form should have an action attribute which is set to X

Adding an action attribute means:

<outer action="X">
  ...
</outer>
1 Like

Thanks, I have passed the level

1 Like