Learn HTML by Building a Cat Photo App - Step 6

Tell us what’s happening:
Describe your issue in detail here.
am not getting the idea of nesting

  **Your code so far**
<html>
<body>
  <h1>CatPhotoApp</h1>
  <main>
         <h2>Cat Photos</h2>
          <!-- TODO: Add link to cat photos -->       

         <p>Click here to view more cat photos.</p>
  </main>
</body>
</html>
  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.5060.134 Safari/537.36 OPR/89.0.4447.71 (Edition Campaign 34)

Challenge: Learn HTML by Building a Cat Photo App - Step 6

Link to the challenge:

You almost got it actually, you’ve just added a bit too much space. You may have used tab twice instead of the spacebar twice (one tab).

To explain the idea of nesting a bit for you however, it’s essentially putting your elements inside of other elements. Indents indicate when an element has been put inside another element or not.
Here’s an example:

<div></div>
<h2>H2 Text</h2>
<p>P Text</p>

In the example above, no elements have been nested, because none of the elements have been put inside another.

<div>
  <h2>H2 Text</h2>
</div>
<p>P Text</p>

In this example, I’ve nested only the h2, and not the p element. We can see that the h2 is now inside of the div element (hence the indent).

<div>
  <h2>H2 Text</h2>
  <p>P Text</p>
</div>

This time I’ve nested the p element inside the div too.
Read over this a few times, and keep going! Things become better understood as you practice more and more.

Restart the step to get the original formatting back. Then follow the instructions exactly:

“Use the space bar on your keyboard to add two more spaces in front of the p element so that it is indented properly as well.”

That is all you need to do, don’t change anything else. If you have questions about the instructions please let us know.

2 Likes

thank you i got it .