Lesson 11 is not working properly… or I just can’t see the solution.
Here is the code:
<!DOCTYPE html>
<html>
<div class="container'>
<head>
<h2>Ollie</h2>
<ul>
<li>sign up</li>
<li>search bikes</li>
<li>reserve a bike</li>
<li>about us</li>
</ul>
<h1>Ollie Bike Sharing</h1>
<h3>Share Your Pedals with the World.</h3>
<p>
Need a set of wheels while you're in town? Ue Ollie to pair your perfect vacation with a stylish, affordable bike rental. Here is a <a href="cities.html">list</a> of cities where you can find us.
</p>
<video width="320" height="240" controls>
<source src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-1/ollie.mp4" type="video/mp4">
</video>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body>
</div>
</body>
</html>
And Here is the Lesson Instructions.
First, we will enclose all the elements between<body>...</body>
in a div element with a class attribute of “container”.
<div class="container">
...
</div>
All the HTML elements you added in previous exercises should be inside the opening <div class="container">
:
the navbar h2
the navbar ul
the company heading h1
the tagline h3
the paragraph
the video
Make sure the closing</div>
tag is at least one line below the closing tag.
Click Run. Notice that the elements have shifted in the web browser. We will fix this effect later on.
There is a contradiction in this. The body is at the bottom of the page. all of the information is outside of “body”. If you follow the instructions based on the keyword “body” then it looks like this:
<!DOCTYPE html>
<html>
<head>
<h2>Ollie</h2>
<ul>
<li>sign up</li>
<li>search bikes</li>
<li>reserve a bike</li>
<li>about us</li>
</ul>
<h1>Ollie Bike Sharing</h1>
<h3>Share Your Pedals with the World.</h3>
<p>
Need a set of wheels while you're in town? Ue Ollie to pair your perfect vacation with a stylish, affordable bike rental. Here is a <a href="cities.html">list</a> of cities where you can find us.
</p>
<video width="320" height="240" controls>
<source src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-1/ollie.mp4" type="video/mp4">
</video>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<div class="main">
<body>
</body>
</div>
</html>
So… I tried it like this, which is removing the body factor from the instructions
<!DOCTYPE html>
<html>
<head>
<div class="main">
<h2>Ollie</h2>
<ul>
<li>sign up</li>
<li>search bikes</li>
<li>reserve a bike</li>
<li>about us</li>
</ul>
<h1>Ollie Bike Sharing</h1>
<h3>Share Your Pedals with the World.</h3>
<p>
Need a set of wheels while you're in town? Ue Ollie to pair your perfect vacation with a stylish, affordable bike rental. Here is a <a href="cities.html">list</a> of cities where you can find us.
</p>
<video width="320" height="240" controls>
<source src="https://s3.amazonaws.com/codecademy-content/projects/make-a-website/lesson-1/ollie.mp4" type="video/mp4">
</video>
<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="main.css">
</div>
</head>
<body>
</body>
</html>
…and it is still considered incorrect.
Am I doing something wrong or are these instructions incorrect?