Bagaimana untuk Menghapuskan Jarak Menegak dalam Bootstrap 4 Lajur?

Menghapuskan Jarak Menegak dalam Bootstrap 4 Lajur

Dalam Bootstrap 4, lajur dengan ketinggian yang berbeza cenderung untuk menjajarkan secara menegak, mengakibatkan ruang kosong di antaranya . Ini berlaku kerana Bootstrap 4 menggunakan flexbox, menyebabkan lajur mematuhi ketinggian lajur tertinggi.

Untuk mengatasi isu ini, anda boleh menggunakan apungan, penyelesaian yang serupa dengan Bootstrap 3. Berikut ialah struktur HTML yang dikemas kini:

<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>

Dalam contoh ini, kelas "d-lg-block" menetapkan "display:block" pada baris dalam skrin besar, membenarkan lajur terapung dan bukannya dibengkokkan. Dengan menggunakan apungan, anda boleh mengawal susunan lajur sambil menghalang jarak menegak yang berlebihan.

Atas ialah kandungan terperinci Bagaimana untuk Menghapuskan Jarak Menegak dalam Bootstrap 4 Lajur?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!