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 Techniques Float Layout Float Layout Challenge

Tommy Gebru
Tommy Gebru
30,164 Points
Posted by Tommy Gebru
Tommy Gebru
30,164 Points

Whats wrong with my code?

Not sure where I went wrong with the code.

It looks like we need a clearfix in the header. Give the main-header element the class we created for clearing floats.
Bummer! Make sure you add the clearfix class to the 'main-header' element.
/* Complete the challenge by writing CSS below */

/* Float Styles
================================ */
.main-logo, .main-nav li{
  float:left;
}

/* Float Clearfix
================================ */

 .group:after {
  content: " ";
  display: table;
  clear: both;
}

4 Answers

Gareth Borcherds
Gareth Borcherds
9,372 Points
Gareth Borcherds
Gareth Borcherds
9,372 Points

The problem is not in your CSS file, but rather in your html file. You need to add the "group" class that they've created for clearing floats to the

 <header class="main-header">

element. So it should look like

<header class="main-header group">

and it'll pass.

Ryan Duchene
PLUS
Ryan Duchene
Courses Plus Student 46,022 Points
Ryan Duchene
Ryan Duchene
Courses Plus Student 46,022 Points

I think that you need to add the .group class to the .main-header HTML element in the HTML. If I'm right, this particular step has nothing to do with your CSS.

MUZ141115 Dzingai Maswimbo
MUZ141115 Dzingai Maswimbo
5,013 Points
MUZ141115 Dzingai Maswimbo
MUZ141115 Dzingai Maswimbo
5,013 Points

jus go to your html file and where it is written, <header class="main-header"> just add group after header and it will pass