Stuck with "Create a Form Element"

HTML-CSS
1

Can anyone help me with this task, I’m stuck for a very long time and none of the suggested solutions in the forum work form me.

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.

It always says the following: Your form should have an action attribute which is set to https://www.freecatphotoapp.com/submit-cat-photo .

  **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">
</main>

  **Your browser information:**

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

Challenge: Create a Form Element

Link to the challenge:

2

I don’t see where you’ve added a form element. Can you post the code with your attempt included?

1 Like
3

Look at the instructions again. If you are having trouble with forms you can either go through the form exercise again or you can read this detailed article about forms

4

Hi, thanks for getting back to me. For some reason it worked today in the morning compared to yesterday evening

<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" placeholder="cat photo URL">
  <input>
  </form>
</main>
5 
<input type="text" placeholder="cat photo URL">
<form action="https://www.freecatphotoapp.com/submit-cat-photo"> <input type="text" placeholder="cat photo URL">
  <input>
  </form>
6

It looks like you have multiple inputs.

Make sure to read the directions very carefully because it says to use the existing input which is this one.

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

7

Unfortunately that is an issue with the way the tests were written because your code shouldn’t be passing.

Just to be clear your code should only have one input on the page.

<form action="https://www.freecatphotoapp.com/submit-cat-photo">
  <input type="text" placeholder="cat photo URL">
</form>

Hope that clears it up!

8

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