CSS CSS Layout CSS Layout Techniques Display

Shivon Kunondjo Hindjou
Shivon Kunondjo Hindjou
1,136 Points

on the .logo how do i change its display mode......help please

/* Complete the challenge by writing CSS below */

header {
  text-align: center;
.logo {
  width: 60px;
  margin: auto;
.main-list { 
  display: inline-block; 
.main-list li {
.main-list ul {
  display: inline-block;
.main-list  img {
  display: auto;
.logo  img {
  display: auto;
<!DOCTYPE html>
    <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">
    <div class="container">
            <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>

1 Answer

Nikos Papapetrou
Nikos Papapetrou
5,577 Points

In your css stylesheet you add in the logo selector the display mode you want. For example:

.main-list a {
    display: block;

You can read more about the display property in the MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/display