<h2>không dùng clear</h2>
<div class="div1">div1</div>
<div class="div2">div2 - Lưu ý rằng div2 đứng sau div1 trong mã HTML. Tuy nhiên, vì div1 trôi về bên trái nên văn bản trong div2 sẽ chảy xung quanh div1.</div>
<br><br>
<h2>dùng clear</h2>
<div class="div3">div3</div>
<div class="div4">div4 - Sử dụng clear: left; di chuyển div4 xuống bên dưới div3. Giá trị "left" xóa các phần tử được chuyển sang bên trái. Bạn cũng có thể xóa "right" và "both"</div>
.div1 {
float: left;
padding: 10px;
border: 3px solid #73AD21;
}
.div2 {
padding: 10px;
border: 3px solid red;
}
.div3 {
float: left;
padding: 10px;
border: 3px solid #73AD21;
}
.div4 {
padding: 10px;
border: 3px solid red;
clear: left;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.