Rumah >hujung hadapan web >tutorial css >Bagaimana untuk Menghapuskan Padding Tambahan dalam Bootstrap 3 Lajur?

Bagaimana untuk Menghapuskan Padding Tambahan dalam Bootstrap 3 Lajur?

Mary-Kate Olsen
Mary-Kate Olsenasal
2024-12-13 07:29:11510semak imbas

How to Eliminate Extra Padding in Bootstrap 3 Columns?

Cara Mengalih Keluar Padding dalam Bootstrap 3

Isu yang dihadapi melibatkan mengalih keluar padding kanan dan kiri lajur col-md-* dalam Bootstrap 3. Kod HTML yang disediakan mengandungi dua lajur bersarang, tetapi hasilnya termasuk jarak tambahan pada sisi lajur.

Output yang Diingini

Matlamatnya adalah untuk menghapuskan ruang tambahan dan meletakkan lajur bersebelahan antara satu sama lain.

Penyelesaian

Masalah timbul daripada menggunakan .col-md-12 sebagai bekas induk untuk lajur. .col-md-12 pada asasnya ialah lajur, bukan baris, dan dengan itu mewarisi jidar dan pelapiknya sendiri. Untuk membetulkannya, adalah penting untuk membalut lajur dalam kelas .row, seperti yang dilihat di bawah:

<div class="container">
    <div class="row">
        <h2>

Pilihan Tambahan

Jika hasil yang diinginkan adalah untuk hapuskan semua jidar dan pelapik, tambahkan kelas untuk menulis ganti gaya ini untuk lajur anak:

.nopadding {
padding: 0 !important;
margin: 0 !important;
}

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

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