플로팅된 요소로 인해 부모 요소의 높이를 감지하지 못하거나 다음 요소가 예상과 다르게 배치될 수 있는 문제를 해결하려면 clear 속성을 사용하면 됩니다.

예를 들어, 다음 예시는 clear 속성을 사용하여 플로팅된 요소의 영향을 해소하는 방법을 보여줍니다:

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

여기서, clearfix 클래스를 가진 요소의 높이를 자식 플로팅된 요소에 맞게 설정하여 레이아웃 깨짐을 방지할 수 있습니다.

clear 속성은 다양한 값을 가질 수 있으며, 주로 none, left, right, both 등이 사용됩니다.

더 자세한 내용은 MDN web docs를 참고해 주세요.