Please clear the air

HTML-CSS
1

in building a cat photo, look at this question:
In the previous step, you nested the h2 element, comment, and p element within the main element. Indenting nested elements two more spaces than their parent element improves readability:

<ul> 
  <li> This `li` element indented </li>
  <li> This `li` element is also indented </li>
</ul>

Add two more spaces in front of the h1, comment, and p elements so your HTML is more readable.
my code says:

<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>

but what i don’t understand is the hint which says:
Your h2 element should be below the main element’s opening tag and its opening tag should start 6 spaces over from the start of the line.

2

From your code the html tag is the start of the line, the body is two spaces from the start, the h1 tag within the body is two spaces from the body, which makes it four spaces from the start of line , the main tag is two spaces from the body tag which also makes it four spaces from the start, within the main you have the h2 tag which is two spaces from main tag, considering the main tag is four spaces from the start, adding that to the h2 tag makes it 6 spaces from the start.

<html>
  <body>
    <h1></h1>
    <main>
      <h2></h2>
    </main>
  </body>
</html>

You can copy and paste this code in an editor, make sure the indentation is intact and do the counting with your cursor, if you still find it difficult to visualize.

3

Thanks, @okibe007 your teaching helped in solving my challenge.

4

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