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 Basics (2014) Basic Layout Clearing Floats

Rodolfo Gamarra
Rodolfo Gamarra
2,542 Points
Posted by Rodolfo Gamarra
Rodolfo Gamarra
2,542 Points

Why dont use display inline-block ?

Hi, i used this:

.resorts, .tips { width:46.5%; display: inline-block; }

.tips { float: right: }

I set float right to tips clas and even if i change it (set float right .resorts instead of .tips ) it works, i would like to know the difference, thanks.

2 Answers

Jaime Gonzalez
Jaime Gonzalez
5,186 Points
Jaime Gonzalez
Jaime Gonzalez
5,186 Points

I had the same question and tried the "inline-block" solution and at first it seems good but when resizing the browser you get a weird behaviour within the divs so they're not aligned properly.

Kenny Nadel
Kenny Nadel
7,695 Points
Kenny Nadel
Kenny Nadel
7,695 Points

It should be .tips { float: right; } The colon should be a semi-colon. Once you fix that little bit, it should work as you are intending.

It works for the resort class at the moment, because I'm betting your first class in the html is resorts. You are setting them both to inline-block properly with the ".resorts, .tips { width:46.5%; display: inline-block; }" declaration, but like I said, it's not floating the tips class properly because of that colon after the word "right" (which should be a semi-colon). Hence, it's ignoring that declaration altogether.