Rumah > hujung hadapan web > tutorial css > Mengapa 4 Lajur Bootstrap Saya Dijajar Menegak Daripada Mendatar?

Mengapa 4 Lajur Bootstrap Saya Dijajar Menegak Daripada Mendatar?

Susan Sarandon
Lepaskan: 2024-11-10 12:08:02
asal
700 orang telah melayarinya

Why Are My Bootstrap 4 Columns Vertically Aligned Instead of Horizontally?

Ketidakkonsistenan Penjajaran Lajur Bootstrap 4

Dalam peralihan daripada Bootstrap 3 kepada 4, anda telah perasan bahawa lajur anda dijajarkan secara menegak dan bukannya secara mendatar. Ini boleh dikaitkan dengan perubahan dalam sistem grid dalam Bootstrap 4.

Isu Col-12

Dalam Bootstrap 3, anda boleh membungkus lajur dalam baris induk menggunakan kelas "col-12". Ini tidak lagi sah dalam Bootstrap 4. Setiap tahap sarang mempunyai barisnya sendiri, jadi alih keluar kelas "col-12" daripada baris induk:

<div class="row">
    <div class="col-md-2">
        <h1>TEST</h1>
    </div>
    <div class="col-md-2">
        <h1>TEST</h1>
    </div>
    <div class="col-md-2">
        <h1>TEST</h1>
    </div>
    <div class="col-md-2">
        <h1>TEST</h1>
    </div>
</div>
Salin selepas log masuk

Ini akan memastikan lajur dijajarkan secara mendatar dan mengekalkan tingkah laku yang diharapkan. Untuk mendapatkan maklumat lanjut tentang bersarang dalam Bootstrap, rujuk dokumentasi rasmi mereka: https://getbootstrap.com/docs/4.0/layout/grid/#nesting

Atas ialah kandungan terperinci Mengapa 4 Lajur Bootstrap Saya Dijajar Menegak Daripada Mendatar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan