Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

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

Carl Sergile
Carl Sergile
16,570 Points
Posted by Carl Sergile
Carl Sergile
16,570 Points

Display: inline-block

Hey stuck on this question. Not getting which one they want me to use. I know the difference between the different display values, just not sure how to answer this.

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

header {
  text-align: center;
}
.logo {
  width: 110px;
  margin: auto;
}
.main-nav li {
  display: inline-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>

2 Answers

Shawn Denham
.a{fill-rule:evenodd;}techdegree
Shawn Denham
Python Development Techdegree Student 17,801 Points

which one are you stuck on? 1 of 3, 2 of 3 or 3 of 3? Either that or post the question :)

Carl Sergile
Carl Sergile
16,570 Points
Carl Sergile
Carl Sergile
16,570 Points

2 out of 3. Might also have a problem with 3 out of 3 too.

Shawn Denham
.a{fill-rule:evenodd;}techdegree
Shawn Denham
Python Development Techdegree Student 17,801 Points

Hmm...I am not sure how to explain these w/out just flat out giving you the answer.

for 2 of 3

.main-nav {
    display: inline-block;
}

and for 3 of 3

.logo {
    display: block;
}

I would recommend go back over these display concepts as the questions are pretty straight forward. Good luck!

-Shawn

Carl Sergile
Carl Sergile
16,570 Points
Carl Sergile
Carl Sergile
16,570 Points

Wow you know what. I misread the instructions. -______- Thanks tho!

Owa Aquino
Owa Aquino
19,277 Points
Owa Aquino
Owa Aquino
19,277 Points

Hi Card!

If I'm correct you're stuck on question #1? Right? Your answer is actually correct, maybe there's a problem on your connection? Try to Refresh your page and do the Code Challenge again. (based on my personal experience)