Hello good fellows I 'm working on how to nest input in "form" I'm stuck on the nesting part kindly help

Tell us what’s happening:
Describe your issue in detail here.

   **Your code so far**

<h2>CatPhotoApp</h2>
<main>
 <p>Click here to view more <a href="#">cat photos</a>.</p>

 <a href="#"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" 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">
 <form action="https://www.freecatphotoapp.com/submit-cat-photo"> <input>
</form>
</main>
   **Your browser information:**

User Agent is: Mozilla/5.0 (Linux; Android 10; Nokia 2.1 Build/QKQ1.190828.002) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Mobile Safari/537.36

Challenge: Create a Form Element

Link to the challenge:

Hello,
The error in your code:

You should nest the input within your form that means your input element should lie in between the opening and closing tags of the form element.

For example :

<form action="url-where-you-want-to-submit-form-data">
  <input></input>
</form>

You can use this example to solve your problem.

1 Like

Have tried it severally but still it doesn’t work

I would like to see your current code

I just noticed the extra input tag in the form element.
You are not required to create a new input element.
The instructions says:

Nest the existing input element inside a form element and assign "https://www.freecatphotoapp.com/submit-cat-photo" to the action attribute of the form element

You have to nest the existing input tag to the form element, and not create a new one.

Tell us what’s happening:
Describe your issue in detail here.

   **Your code so far**

<h2>CatPhotoApp</h2>
<main>
 <p>Click here to view more <a href="#">cat photos</a>.</p>

 <a href="#"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" 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">
<form action="https://www.freecatphotoapp.com/submit-cat-photo">
<input type="text">
</form>
    
  
</main>
   **Your browser information:**

User Agent is: Mozilla/5.0 (Linux; Android 10; Nokia 2.1 Build/QKQ1.190828.002) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.138 Mobile Safari/537.36

Challenge: Create a Form Element

Link to the challenge:

You have added an extra input element, which you have nested in the form element.

You are supposed to nest the existing input element in the form element , and not another new input element.

Read the error:

The existing input element should be nested within a
form element.

Thank you ,problem solved

1 Like

It helps if you fill this part out. Practicing describing problems is important.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.