일반적으로, clear 속성은 left, right, both, none 값을 가질 수 있습니다.

• left: 왼쪽에 플로팅된 요소 바로 다음에 오는 요소의 플로팅을 막습니다.
• right: 오른쪽에 플로팅된 요소 바로 다음에 오는 요소의 플로팅을 막습니다.
• both: 왼쪽, 오른쪽에 플로팅된 모든 요소 바로 다음에 오는 요소의 플로팅을 막습니다.
• none: 플로팅된 요소의 영향을 받지 않습니다.

예를 들어, 다음과 같이 사용할 수 있습니다.

.clearfix::after {
  content: "";
  display: table;
  clear: both;
}

자세한 정보는 MDN web docs를 참조하세요.