Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML HTML Basics Structuring Your Content Structuring Content Challenge

Posted by James Lowry
James Lowry
7,975 Points

Place the content between the header and footer (h2, p and ul) inside an element that represents standalone sections.

I'm not sure what they are wanting me to do on this question in the 3rd part of the challenge. I have put <section> in the middle of the Header and Footer. This contains the h2, p, and ul elements.

These questions are poorly worded.

Thank you for the help.

index.html 
<!DOCTYPE html>
<html>
  <head>
    <link href="styles.css" rel="stylesheet">
    <title>My Portfolio</title>

  </head>
  <body>
    <header>
    <section>

      <ul>
        <li><a href="#">About</a></li>
        <li><a href="#">Work</a></li>
        <li><a href="#">Contact</a></li>            
      </ul>

        <h1>My Web Design &amp; Development Portfolio!</h1> 
       <p>A site featuring my latest work.</p>
    </section>
    </header>  
    <section>
      <article>
        <h2>Welcome</h2>
      </article>  
    <article>
      <p>Fusce semper id ipsum sed scelerisque. Etiam nec elementum massa. Pellentesque tristique ex ac ipsum hendrerit, eget feugiat ante faucibus.</p>
     </article>   
      <nav>
        <ul>
          <li><a href="#">Recent project #1</a></li>
          <li><a href="#">Recent project #2</a></li>
          <li><a href="#">Recent project #3</a></li>     
        </ul>
        </nav>
    </section>  
    <footer>
        <section>
          <p>&copy; 2017 My Portfolio</p>
          <p>Follow me on <a href="#">Twitter</a>, <a href="#">Instagram</a> and <a href="#">Dribbble</a></p>
        </section>
     </footer>  
  </body>
</html>
Jonatan Jansson
Jonatan Jansson
1,027 Points

What's misleading about this one is the parenthesis which states what tags the new section should be wrapped around, it does not call for wrapping around let's say <h1> which ought to be the first one.

Place the content between the header and footer (h2, p and ul) inside an element that represents standalone sections of content.

Steven Parker
Steven Parker
229,732 Points
Steven Parker
Steven Parker
229,732 Points

There's no h1 between the header and footer. The only h1 on the page is inside the header.

16 Answers

Steven Parker
Steven Parker
229,732 Points
Steven Parker
Steven Parker
229,732 Points

The instructions say to "Place the content between the header and footer...", so you would use only one new element to enclose the area they are talking about.

You would not put additional elements inside the header or footer.

James Lowry
James Lowry
7,975 Points

Steven,

Everything inside the header and footer were from the previous steps on the challenge. The h2, p, and ul are what was already between the header and footer elements. I have tried just one <section> element around these 2 and questioned if they were wanting the <nav> and <article> elements afterwards.

James Lowry
James Lowry
7,975 Points

Removed the other items as you said and it worked perfectly. Thanks

Jason Headley
Jason Headley
2,884 Points
Jason Headley
Jason Headley
2,884 Points

</header> <section> <ul> <li><a href="#">About</a></li> <li><a href="#">Work</a></li> <li><a href="#">Contact</a></li>
</ul> <h1>My Web Design & Development Portfolio!</h1> <p>A site featuring my latest work.</p>

 </section>

<h2>Welcome</h2>

edward nichter
edward nichter
2,410 Points
edward nichter
edward nichter
2,410 Points

Why are so many of these questions so poorly worded?

Steven Parker
Steven Parker
229,732 Points
Steven Parker
Steven Parker
229,732 Points

Just a guess, but since students can be anywhere in the world, perhaps English is not the primary language of several of them. I applaud the ambition of those attempting to master coding and another language at the same time!

Vincent Evanshine
Vincent Evanshine
2,559 Points

Edward,

I have many the same questions. Please help.

Love, Steven

Joshua Sacrey
Joshua Sacrey
489 Points
Joshua Sacrey
Joshua Sacrey
489 Points

ahhh they just want section, but yes the question I was a little confused on as well, thanks for the help everyone

Chin Wui Chong
Chin Wui Chong
4,133 Points
Chin Wui Chong
Chin Wui Chong
4,133 Points

<!DOCTYPE html> <html> <head> <link href="styles.css" rel="stylesheet"> <title>My Portfolio</title> </head> <body> <header> <u1></u1> <h1></h1> <p></p> </header> <section> <ul> <li><a href="#">About</a></li> <li><a href="#">Work</a></li> <li><a href="#">Contact</a></li>
</ul> <h1>My Web Design & Development Portfolio!</h1> <p>A site featuring my latest work.</p> </section>

<h2>Welcome</h2> 
<p>Fusce semper id ipsum sed scelerisque. Etiam nec elementum massa. Pellentesque tristique ex ac ipsum hendrerit, eget feugiat ante faucibus.</p>
<ul>
  <li><a href="#">Recent project #1</a></li>
  <li><a href="#">Recent project #2</a></li>
  <li><a href="#">Recent project #3</a></li>     
</ul>

<footer> <p>© 2017 My Portfolio</p> <p>Follow me on <a href="#">Twitter</a>, <a href="#">Instagram</a> and <a href="#">Dribbble</a></p></footer> </body> </html>

fl6
fl6
6,900 Points

<!DOCTYPE html> <html> <head> <link href="styles.css" rel="stylesheet"> <title>My Portfolio</title> </head> <body> <header> <u1></u1> <h1></h1> <p></p> </header> <section> <ul> <li><a href="#">About</a></li> <li><a href="#">Work</a></li> <li><a href="#">Contact</a></li> </ul> <h1>My Web Design & Development Portfolio!</h1> <p>A site featuring my latest work.</p> </section>

<h2>Welcome</h2> <p>Fusce semper id ipsum sed scelerisque. Etiam nec elementum massa. Pellentesque tristique ex ac ipsum hendrerit, eget feugiat ante faucibus.</p> <ul> <li><a href="#">Recent project #1</a></li> <li><a href="#">Recent project #2</a></li> <li><a href="#">Recent project #3</a></li>
</ul>

<footer> <p>© 2017 My Portfolio</p> <p>Follow me on <a href="#">Twitter</a>, <a href="#">Instagram</a> and <a href="#">Dribbble</a></p></footer> </body> </html>

Zachary Scott
Zachary Scott
1,650 Points
Zachary Scott
Zachary Scott
1,650 Points

This worked for me:

<!DOCTYPE html>
<html>
  <head>
    <link href="styles.css" rel="stylesheet">
    <title>My Portfolio</title>
  </head>
  <body>

    <header>
      <nav>
          <ul>
            <li><a href="#">About</a></li>
            <li><a href="#">Work</a></li>
            <li><a href="#">Contact</a></li>            
          </ul>
      </nav>
        <h1>My Web Design &amp; Development Portfolio!</h1> 
        <p>A site featuring my latest work.</p>
    </header>

    <section>
        <h2>Welcome</h2> 
        <p>Fusce semper id ipsum sed scelerisque. Etiam nec elementum massa. Pellentesque tristique ex ac ipsum hendrerit, eget feugiat ante faucibus.</p>
        <nav>
            <ul>
              <li><a href="#">Recent project #1</a></li>
              <li><a href="#">Recent project #2</a></li>
              <li><a href="#">Recent project #3</a></li>     
            </ul>
        </nav>
    </section>

    <footer>
        <p>&copy; 2020 Zach Land</p>
        <p>Follow me on <a href="#">Twitter</a>, <a href="#">Instagram</a> and <a href="#">Dribbble</a></p>
    </footer>

  </body>
</html>
Jmaisin Williams
Jmaisin Williams
8,263 Points

yeah that one worked for me as well

Anthony Montgomery
Anthony Montgomery
1,161 Points
Anthony Montgomery
Anthony Montgomery
1,161 Points

<section> <ul> <li><a href="#">About</a></li> <li><a href="#">Work</a></li> <li><a href="#">Contact</a></li>
</ul> <h1>My Web Design & Development Portfolio!</h1> <p>A site featuring my latest work.</p>
</section>

juliewilliams
juliewilliams
2,400 Points
juliewilliams
juliewilliams
2,400 Points

Put the " <section> " tag before the </article> tag. Put the closing " </section> " tag after the </ul> under end of <h2> before the <footer>.

See the example below.

<section>
</article>
<h1>My Web Design &amp; Development Portfolio!</h1> 
    <p>A site featuring my latest work.</p>
  </header>
  <h2>Welcome</h2> 
<p>Fusce semper id ipsum sed scelerisque. Etiam nec elementum massa. Pellentesque tristique ex ac ipsum hendrerit, eget feugiat ante faucibus.</p>
<ul>
  <li><a href="#">Recent project #1</a></li>
  <li><a href="#">Recent project #2</a></li>
  <li><a href="#">Recent project #3</a></li>     
  </ul>
</section>

<footer>

Willly Bouciquot
Willly Bouciquot
6,535 Points

thank youuuu!!!!!!!!! julie williams it's work

Melisse Gamache
Melisse Gamache
4,634 Points
Melisse Gamache
Melisse Gamache
4,634 Points

The solution is to type <section></section> between h2 and ul:

<section> <h2>Welcome</h2> <p>Fusce semper id ipsum sed scelerisque. Etiam nec elementum massa. Pellentesque tristique ex ac ipsum hendrerit, eget feugiat ante faucibus.</p> <ul> <li><a href="#">Recent project #1</a></li> <li><a href="#">Recent project #2</a></li> <li><a href="#">Recent project #3</a></li>
</ul> </section>

Joy Manuel
Joy Manuel
6,464 Points

this is what I did, it did not work. :(

Felix Westphal
Felix Westphal
3,956 Points
Felix Westphal
Felix Westphal
3,956 Points

Thank you Melisse Gamache , this helped.

James Lowry
James Lowry
7,975 Points
James Lowry
James Lowry
7,975 Points

Steven,

Everything inside the header and footer were from the previous steps on the challenge. The h2, p, and ul are what was already between the header and footer elements. I have tried just one <section> element around these 2 and questioned if they were wanting the <nav> and <article> elements afterwards.

Rachel Green
PLUS
Rachel Green
Courses Plus Student 473 Points
Rachel Green
Rachel Green
Courses Plus Student 473 Points

They want the answer ABOVE the closing </header> and closing </footer>

So technically the question seems like it is stated wrong. In the ( ) it should include h1 but id does NOT and it makes you second guess your placement of the element

ferdinand reusora
PLUS
ferdinand reusora
Courses Plus Student 2,780 Points
ferdinand reusora
ferdinand reusora
Courses Plus Student 2,780 Points

I only add <section></section> between header and footer, inside the section element will be the h2,p, and ul..

Unsubscribed User
PLUS
Unsubscribed User
Courses Plus Student 2,178 Points
Unsubscribed User
Unsubscribed User
Courses Plus Student 2,178 Points

The question was a bit difficult to understand. I solved it this way.

          <!DOCTYPE html>
<html>
  <head>
    <link href="styles.css" rel="stylesheet">
    <title>My Portfolio</title>
  </head>
  <body>
    <header>
    <ul>
      <li><a href="#">About</a></li>
      <li><a href="#">Work</a></li>
      <li><a href="#">Contact</a></li>            
    </ul>
    <h1>My Web Design &amp; Development Portfolio!</h1> 
    <p>A site featuring my latest work.</p>
    <h2>Welcome</h2> 
    <p>Fusce semper id ipsum sed scelerisque. Etiam nec elementum massa. Pellentesque tristique ex ac ipsum hendrerit, eget feugiat ante faucibus.</p>
    <ul>
      <li><a href="#">Recent project #1</a></li>
      <li><a href="#">Recent project #2</a></li>
      <li><a href="#">Recent project #3</a></li>     
    </ul>
    </header>
    <section>
    <footer>
    <p>&copy; 2017 My Portfolio</p>
    <p>Follow me on <a href="#">Twitter</a>, <a href="#">Instagram</a> and <a href="#">Dribbble</a></p>
    </section>   
    </footer>
  </body>
</html>
          ```
doga karincali
doga karincali
652 Points
doga karincali
doga karincali
652 Points

Seems like it could of been worded much better, however, it is asking to start the section from the <h2> tag. The <h1> tag in the header is clearly not what its asking for. Maybe it we should read better, or maybe it should be worded a little better.

Rachael Mazvita Sabondo
Rachael Mazvita Sabondo
1,371 Points
Rachael Mazvita Sabondo
Rachael Mazvita Sabondo
1,371 Points

<section> <h2>Welcome</h2> <p>Fusce semper id ipsum sed scelerisque. Etiam nec elementum massa. Pellentesque tristique ex ac ipsum hendrerit, eget feugiat ante faucibus.</p> <ul> <li><a href="#">Recent project #1</a></li> <li><a href="#">Recent project #2</a></li> <li><a href="#">Recent project #3</a></li> </ul> </section>