TAG
CSS
JavaScript
Result
Run
License
<p> <input type="checkbox" id="toggle-bfc" /> <label for="toggle-bfc">ON/OFF BFC</label> </p> <div class="parent"> <div class="child">왼쪽으로 플로팅된 요소</div> </div> <div>BFC 적용 대상의 형제</div>
.parent { border: 1px solid #999; } .child { background: #CCC; float: left; box-shadow: 3px 3px 2px #666; }
window.addEventListener("load", () => { const elParent = document.querySelector(".parent"); document.getElementById("toggle-bfc").onclick = e => { if (e.currentTarget.checked) elParent.style.overflow = "hidden"; else elParent.style.overflow = "visible"; }; });
Console
expand_less
License
License
by DevDic
Close