8.Wrap with a div, Help! Oops, try again. Place the supporting content in the <div class="container">..</div>


#1

<!DOCTYPE html>
<html>
  <body>
  
  <div class="nav">
    <div class="container">
    <ul>
        <li>Natali</li>
        ...
    </ul>
    
    <ul>
        <li>Sign Up</li>
        ...
    </ul>
    </div>
</div>

    <div class="jumbotron">
        <div class="container">
        <h1>Find a place to stay</h1>
        <p>Rent from people in over 34,000 cities and 192 countries</p>
        </div>
        </div>

        <div>
        <h3>Travel</h3>
        <p>From apartments and rooms to treehouses and boats: stay in unique spaces in 192 contries</p>
        <p>
        <a href="#">See how to travel on Airbnb</a>
        </p>
        </div>

        <div>
        <h3>Host</h3>
        <p>Renting out your unused space could pay your bills or fund your next vacation</p>
        <p>
        <a href="#">Learn more about hosting</a>
        </p>
        </div>

        <div>
        <h3>Trust and safety</h3>
        <p>From Verified ID to our worldwide customer support team, we've got your back</p>
        <p>
        <a href="#">Learn about trust at Airbnb</a>
        </p>
        </div>

        <div class="learn-more">
  <div class="container">
    <div>
      <h3>Travel</h3>
      ...
    </div>

    <div>
      <h3>Host</h3>
      ...
    </div>

    <div>
      <h3>Trust and Safety</h3>
      ...
    </div>
  </div>
</div>

    <h1>Find a place to stay</h1>
    <p>Rent from people in over 34,000 cities and 192 countries</p>

	<ul>
	  <li>Natali</li>
	<li>Browse</li>
	</ul>
	<ul>
	<li>Sign Up</li>
	<li>Log In</li>
	<li>Help</li>
	</ul>
	<ul>
	
  </body>
</html>

#2

You have things just a little bit mixed up there. You may want to try looking back over a couple of the previous exercises to make sure that you get things in the expected order.

Keeping your matching open/close tags at the same indent level will help you see what you are building.

Here is the overall plan that you are aiming for:

<!DOCTYPE html>
<html>
  <body>

    <div class="nav">
      <div class="container">
      ... your nav code goes in here
      </div>
    </div>

    <div class="jumbotron">
      <div class="container">
      ... your jumbotron code goes in here
      </div>
    </div>
    
    <div class="learn-more">
      <div class="container">
        ... your learn-more code goes in here
      </div>
    </div>

  </body>
</html>

#3

A post was split to a new topic: Place your h1 element and p element in between

..
tags


#5

but I was held exercises again and it does not help... thanks for the answer)

<!DOCTYPE html>
<html>
  <body>
  
  <div class="nav">
    <div class="container">
    <ul>
        <li>Natali</li>
        ...
       </ul>
            <ul>
        <li>Sign Up</li>
        ...
    </ul>
    </div>
</div>

    <div class="jumbotron">
        <div class="container">
        <h1>Find a place to stay</h1>
        <p>Rent from people in over 34,000 cities and 192 countries</p>
        </div>
        <div>

        <h3>Travel</h3>
        <p>From apartments and rooms to treehouses and boats: stay in unique spaces in 192 contries</p>
        <p>
        <a href="#">See how to travel on Airbnb</a>
        </p>
        </div>
        <div>
        <h3>Host</h3>
        <p>Renting out your unused space could pay your bills or fund your next vacation</p>
        <p>
        <a href="#">Learn more about hosting</a>
        </p>
        </div>
        <div>
        <h3>Trust and safety</h3>
        <p>From Verified ID to our worldwide customer support team, we've got your back</p>
        <p>
        <a href="#">Learn about trust at Airbnb</a>
        </p>
        </div>

    <h1>Find a place to stay</h1>
    <p>Rent from people in over 34,000 cities and 192 countries</p>
	<ul>
	  <li>Natali</li>
	<li>Browse</li>
	</ul>
	<ul>
	<li>Sign Up</li>
	<li>Log In</li>
	<li>Help</li>
	</ul>
	<ul>
	<div>

	<div class="learn-more">
  <div class="container">
    <div>
      <h3>Travel</h3>
      ...
    </div>
    <div>
      <h3>Host</h3>
      ...
    </div>
    <div>
      <h3>Trust and Safety</h3>
      ...
    </div>
  </div>
</div>

  </body>
</html>

#6

You still have several things in unexpected places. Let's look at one example.

Near the top, you have this nav div:

  <div class="nav">
    <div class="container">
    <ul>
        <li>Natali</li>
        ...
       </ul>
            <ul>
        <li>Sign Up</li>
        ...
    </ul>
    </div>
</div>

But - down near the bottom you have the two ul elements that are expected to be in that nav div, these:

	<ul>
	  <li>Natali</li>
	<li>Browse</li>
	</ul>
	<ul>
	<li>Sign Up</li>
	<li>Log In</li>
	<li>Help</li>
	</ul>

Why? How did that happen?


#7

thank you very much!!! :relieved: i realized my mistake, thank you :smile: