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 How to Make a Website Responsive Web Design and Testing Adjust the Profile Page and Header

Posted by saber
saber
13,276 Points

Header float left, bad practice?

In an earlier video, we were told to float the header left. It was said at the time that this didn't have any practical use at the time... but would later when we made the adjustments for the desktop version (in this video).

In this video, we use a media query to float the nav right.

Is it really best practice to float the entire header left and then override the nested nav to the right? That seems like bad design to me.

1 Answer

yannverreault
yannverreault
12,599 Points
yannverreault
yannverreault
12,599 Points

You don't float the whole header to the left. You float your elements inside the header. Your nav to the right and the logo to the left. After that, you want to clear your header so it doesn't collapse.

To do so, you can use this clearfix. I suggest you that you add the class="group" to your header.

.group:before, .group:after { content: " "; /* 1 / display: table; / 2 */ }

.group:after { clear: both; }

Let me know if this work.