CSS CSS Layout CSS Layout Techniques Display

Geovani Estacio
Geovani Estacio
1,654 Points

I am stuck in this one, not sure what I am suppose to be doing?

style.css
/* Complete the challenge by writing CSS below */

header {
  text-align: center;
}
.logo {
  width: 60px;
  margin: auto;
}
.main-list li{display:inline-block;
  width:20%;
  background-color: yellow;

}
index.html
<!DOCTYPE html>
<html>
<head>
    <title>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>
            <img class="logo" src="city-logo.svg" alt="An illustration of a building">
            <ul class="main-list">
                <li><a href="#">Donuts</a></li>
                <li><a href="#">Tea</a></li>
                <li><a href="#">Coffee</a></li>
            </ul>
        </header>
    </div>
    </body>
</html>

1 Answer

Gavin Johnston
Gavin Johnston
7,631 Points

What exactly are you stuck on? you seem to have done the first part of the challenge correctly (set the display property to inline-block) next part is to do the same with the ul class..