CSS CSS Layout Basics Getting Started with CSS Layout Layout Wrapper Challenge

Set the wrapper's width to 80% of the browser width. Then use margins to center the wrapper in the browser.

Set the wrapper's width to 80% of the browser width. Then use margins to center the wrapper in the browser.

index.html
<!DOCTYPE html>
<html>
<head>
    <title>Getting Started with CSS Layout</title>
    <link href='https://fonts.googleapis.com/css?family=Varela+Round' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="page.css">
    <link rel="stylesheet" href="style.css">
</head>
    <body>
    <div class="container">

        <header>
            <h1>Best City Guide</h1>
        </header>

        <div class="main">
            <h2>Welcome!</h2>
            <p>Dessert toffee chocolate lollipop fruitcake cake sweet. Pudding cotton candy chocolate pudding liquorice jelly marzipan. Muffin gummies topping lollipop. Caramels chocolate cake donut liquorice.</p>
            <p>Cake sesame snaps sweet tart candy canes tiramisu I love oat cake chocolate bar. Jelly beans pastry brownie sugar plum pastry bear claw tiramisu tootsie roll.</p>
        </div>

        <footer>
            <p>&copy;2015 Residents of The Best City.</p>
        </footer>
    </div>
    </body>
</html>
style.css
/* Complete the challenge by writing CSS below */
.container
{
 width :80%;
  margin: 0 auto;
}

1 Answer

Ruud Claassen
Ruud Claassen
9,359 Points

Your code is ok. Looks like a validation bug. Removing the space after "width" and before ":", will make it work.