clearFix

by qwerew0

HTML

<div class="container clearfix">
    <div class="left"></div>
    <div class="right"></div>
    <!-- <div class="clear"></div> -->
</div>

CSS

.container {
    background-color: #ccc;
    border-top: 20px solid blue;
    border-bottom: 20px solid black;
   overflow: auto;
}

.left {
    background-color: orangered;
    width: 100px;
    height: 100px;
    float: left;
}

.right {
    background-color: green;
    width: 100px;
    height: 100px;
    float: right;
}

/* .clear {
clear: both;
} */

/*  
.clearfix::after {
content: "";
display: block;
clear: both;
} */