BFC

use BFC to contain floats

by JuneDeng

HTML

<div class="container">
<div>june</div>
<div>june</div>
</div>
<p><button>click me to check</button></p>

CSS

.container {
  background-color: green;
}

.oh {
  overflow: hidden;
}

.container div {
  background-color: purple;
  float: left;
  margin: 10px;
}

JavaScript

let btn =document.querySelector('button'),
container = document.querySelector('.container');
btn.addEventListener('click', function () {
  container.classList.toggle('oh');
}, false);