HTML HTML Basics Structuring Your Content Structuring Content Challenge

Pedro Azedo
Pedro Azedo
433 Points

Need the solution for this exercise please

Need the solution for this exercise please

index.html
<!DOCTYPE html>
<html>
  <head>
    <link href="styles.css" rel="stylesheet">
    <title>My Portfolio</title>
  </head>
  <body>
    <nav>
    <ul>
      <li><a href="#">About</a></li>
      <li><a href="#">Work</a></li>
      <li><a href="#">Contact</a></li>            
    </ul>
    </nav>

    <article>
    <h1>My Web Design &amp; Development Portfolio!</h1> 
    <p>A site featuring my latest work.</p>
    </article>


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


    <p>&copy; 2017 My Portfolio</p>
     <aside>
    <p>Follow me on <a href="#">Twitter</a>, <a href="#">Instagram</a> and <a href="#">Dribbble</a></p>
   </aside>

   </body>
</html>

4 Answers

Jamie Reardon
Jamie Reardon
Front End Web Development Techdegree Student 7,266 Points

First Challenge Solution:

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

    <article>
    <h1>My Web Design &amp; Development Portfolio!</h1> 
    <p>A site featuring my latest work.</p>
    </article>


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


    <p>&copy; 2017 My Portfolio</p>
     <aside>
    <p>Follow me on <a href="#">Twitter</a>, <a href="#">Instagram</a> and <a href="#">Dribbble</a></p>
   </aside>

   </body>
</html>

Use the header element to wrap around the content. Header tags are considered introductory content.

Pedro Azedo
Pedro Azedo
433 Points

the question is "Place the ul, h1 and p elements at the top of the page inside an element that represents a group of introductory content." In the previous video I was taught about nav, article and aside. I tried different combinations of this tags without success.

Jamie Reardon
Jamie Reardon
Front End Web Development Techdegree Student 7,266 Points

I gave you the answer to the first part of the challenge. I have done the HTML Basics and intro to HTML courses and learned about this.

A webpage is typically divided into sections:

  • Header <header> - Used for introductory content that typically contains a title, logo, and a navigation menu.
  • Main <main> - The bulk of your content what you want to share with the rest of the world.
  • Footer <footer> - Generally contains copyright Information, social media links etc.
Pedro Azedo
Pedro Azedo
433 Points

Thank you, I finally got it. :)

I used <section> instead of <main> but it worked