CSS CSS Layout Basics Controlling Layout with CSS Display Modes CSS Display Modes Challenge

Jesus Garcia
seal-mask
.a{fill-rule:evenodd;}techdegree
Jesus Garcia
Front End Web Development Techdegree Student 2,386 Points

The logo is an <img>, so it displays inline with surrounding content by default. The logo displays on the same line as .

I am lost someone pls help.

style.css
header {
  text-align: center;
}
.logo {
  width: 110px;
  margin: 0 auto;
}

.name,
.main-nav
.main-nav li {
display:block;

}
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>
            <img class="logo" src="city-logo.svg" alt="logo">
            <ul class="main-nav">
                <li><a href="#">Ice cream</a></li>
                <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

Adam N
Adam N
70,212 Points

Watch this short video I made about where you're going wrong.

Let us know if you have any further questions.

Adam N
Adam N
70,212 Points

np! You can mark this question as solved by selecting a "best answer". :+1:

Dongmi Heo
Dongmi Heo
6,745 Points

Hello I solved the same task until the second differently with the above answer, but I don't know how I can approach the solution of the third task.. Even if I tried the way in the video and changing display mode, I can't find out solution....