<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
p {
background-color: green;
width: 300px;
margin: 10px;
}
.float {
float: left;
}
</style>
</head>
<body>
<h2>clear: both 사용 전</h2>
<p class="float">
float:left를 적용한 p태그<br/>
float:left를 적용한 p태그<br/>
float:left를 적용한 p태그<br/>
</p>
<p style="background-color: blue;">
clear: both를 적용하지 않은 p태그<br/>
clear: both를 적용하지 않은 p태그<br/>
clear: both를 적용하지 않은 p태그<br/>
</p>
<h2>clear: both 사용 후</h2>
<p class="float">
float:left를 적용한 p태그<br/>
float:left를 적용한 p태그<br/>
float:left를 적용한 p태그<br/>
</p>
<div style="clear: both;"></div>
<p style="background-color: blue;">
clear: both를 적용한 p태그<br/>
clear: both를 적용한 p태그<br/>
clear: both를 적용한 p태그<br/>
</p>
</body>
</html>