Mengapakah Dua Elemen Blok Sebaris Lebar 50% Tidak Sentiasa Muat Bersebelahan?

Mengapa Elemen Blok Sebaris dengan Lebar 50% Tidak Muat Bersebelahan

Apabila dua elemen blok sebaris ditentukan dengan 50 % lebar, mereka sering gagal menjajarkan sebelah menyebelah. Isu ini timbul daripada ruang putih yang wujud antara elemen blok sebaris, yang menduduki lebih kurang 4px.

Isu Ruang Putih

Termasuk ruang putih ini, lebar gabungan kedua-dua div melebihi 100 %, menyebabkan mereka pecah. Sebagai contoh, jika kita menggunakan dua div blok sebaris dengan lebar 50% setiap satu, jumlah lebar menjadi 150% daripada bekas, menghasilkan yang berikut:

<div>50% + 4px whitespace + 50%</div>

Penyelesaian

Sambil mengurangkan lebar satu div kepada 49% boleh menyelesaikan isu, ia memperkenalkan jurang kecil antara div. Sebagai alternatif, mengapungkan div berfungsi dengan berkesan.

Walau bagaimanapun, untuk pembangunan web moden, sangat disyorkan untuk menggunakan flexbox atau reka letak grid CSS dan bukannya sekatan sebaris kerana ia memberikan kawalan yang lebih baik ke atas kedudukan elemen dan menyelesaikan isu ruang kosong.

Atas ialah kandungan terperinci Mengapakah Dua Elemen Blok Sebaris Lebar 50% Tidak Sentiasa Muat Bersebelahan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!