From the course: CSS Essential Training
Join today to access over 22,700 courses taught by industry experts or purchase this course individually.
Clearing floats
- [Narrator] In the previous float exercise we applied the clear property to a specific element to return the page back to its normal flow. But what if there is no element to apply the clear to? In this example, the blue box is floated to the left, taking it out of the normal flow. As a result, the parent element shown with the black border will not recognize the height of the floated element, which will cause it to overflow outside of the parent element. If all the child elements are floated, then the parent element's height will collapse to zero. Elements that are not in the same container as the float will also be affected. If there is enough space, the elements that come after the float will stack underneath in the available space. Their child elements will also flow around the floated elements. When there's no element in the same container as the float to which a clear style can be applied to, a self clear must be…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.