Using the clear method

Let's solve this using the clear property. What we'll do at the end of secondary-section is add a class of clear to a new div, using the following code:

<div class="clear"></div> 

Next, we'll go into our CSS, and in the area reserved for global styles, underneath the ruleset targeting the wrapper class; this is where we'll create the clear selector and add clear: both:

/***************Global***************/::-moz-selection {  background-color: #eb2428; }::selection {  background-color: #eb2428; }.wrapper {  margin: 0 auto;  width: 960px;}.clear {  clear: both;}

So, if we save this and return to the browser, our background color will be green with a bottom margin of 50px. Everything is working very well:

However, we've added ...

Get Mastering CSS now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.