HTML HTML Basics Structuring Your Content Structuring Content Challenge

Its asking me to place a h2 <p> <ul> but im confused where it need to be placed.

I'm struggling where I'm suppose to be putting the coding in html.

index.html
<!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>
   <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>
   </footer>
  </body>
</html>

5 Answers

Steven Parker
Steven Parker
140,501 Points

The <h2>, <p> and <ul> elements are already there. Your task is to put a container element around them "that represents a group of introductory content", which would be a header element:

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

For this entire challenge you will be adding semantic containers around code that is already there.

josephr
josephr
18,876 Points

They want you to put all those elements within <header></header> tags. The wording is a little unclear, but the hint is "group of introductory content."

    <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>
Steven Parker
Steven Parker
140,501 Points

:warning: This is not a correct solution, though it appears you'e discovered a bug in the validator that makes it pass task 1.
But you'd have trouble completing later tasks.

So what do I restart it. I understand the header and footer concepts lol.

Steven Parker
Steven Parker
140,501 Points

You could restart, or just move the ending </header> tag. It's currently enclosing more than the instructions asked for.

thats so confusing lol.

pls show me what task one looks like. I understand the content, I guess what I missed placed was how the placing was suppose to go.

Steven Parker
Steven Parker
140,501 Points

OK, I revised my answer to show the proper header placement for task 1.