Bootstrap 4열에서 세로 간격을 제거하는 방법은 무엇입니까?

Bootstrap 4열에서 세로 간격 제거

Bootstrap 4에서는 높이가 다른 열이 세로로 정렬되어 열 사이에 빈 공간이 생기는 경향이 있습니다. . 이는 Bootstrap 4가 Flexbox를 활용하여 열이 가장 높은 열의 높이에 일치하기 때문에 발생합니다.

이 문제에 대응하려면 Bootstrap 3과 유사한 해결 방법인 부동 소수점을 사용할 수 있습니다. 업데이트된 HTML 구조는 다음과 같습니다.

<div class="container">
  <div class="row d-lg-block">
    <div class="col-lg-9 float-left description">Description</div>
    <div class="col-lg-3 float-right sidebar">Sidebar</div>
    <div class="col-lg-9 float-left comments">Comments</div>
  </div>
</div>

이 예에서 "d-lg-block" 클래스는 대형 화면의 행에 "display:block"을 설정하여 열이 구부러지는 대신 부동할 수 있도록 합니다. 부동 소수점을 사용하면 과도한 세로 간격을 방지하면서 열 순서를 제어할 수 있습니다.

위 내용은 Bootstrap 4열에서 세로 간격을 제거하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!