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 trialNigel Rodgers
15,777 PointsI found another method to fix collapsing boundaries.
I figured out another method to fix the collapsing boundaries issue. I added an empty div and gave it the class 'clear':
<div class="clear"></div>
in CSS I cleared the floats in the '.clear' div:
.clear { clear: both; }
Here's a link to my workspace: https://w.trhou.se/1vu5bv0g4v check lines 40 in index.html and line 156 in style.css
1 Answer
Steven Parker
231,236 PointsSure, that's essentially the same thing as the well-known "clearfix". The difference with the conventional clearfix is that it employs a pseudo-element to make adding an extra DIV to the HTML unnecessary.
The conventional way would be to add this to CSS (but no change to the HTML):
.container::after {
content: "";
display: block;
clear: both;
}
If you don't mind adding to the HTML, your method is functionally identical.
Nigel Rodgers
15,777 PointsNigel Rodgers
15,777 PointsIs it a good idea?