<!DOCTYPE html>
<html lang=
"en">
<head>
<meta charset=
"UTF-8">
<title>Document</title>
<style>
.box1{
border: darkorange 5px solid
;
}
.box2{
width: 200px
;
height: 400px
;
background-color: tomato
;
float: left
;
}
.box3{
clear: both
;
}
.boxa{
border: teal 5px solid
;
}
.boxb{
width: 200px
;
height: 300px
;
background-color: green
;
float: left
;
}
.boxa::after{
content: '';
display: block
;
clear: both
;
}
</style>
</head>
<body>
<div class=
"box1">
<div class=
"box2"></div>
<div class=
"box3"></div>
</div>
<br/>
<div class=
"boxa">
<div class=
"boxb"></div>
</div>
</body>
</html>
