float

by rootjang

HTML

<!DOCTYPE html>
<html lang="ko-KR">
<head>
  <meta charset="UTF-8">
  <title>float</title>
</head>
<body>
  <div class="box1">박스1</div>
  <div class="box2">박스2</div>
  <div class="box3">박스3</div>
  <div class="box4">박스4</div>
</body>
</html>

CSS

.box1 {
  float: left;
  padding: 20px;
  margin-right: 10px;
  background: #ffd800;
}

.box2 {
  background: #0094ff;
  padding: 20px;
  margin-right: 10px;
  float: left;
}

.box3 {
  background: #00ff21;
  padding: 20px;
  float: left;
}

.box4 {
  float: right;
  background: #ffffff;
  padding: 20px;
  border: 1px solid black;
}