Bagaimanakah Saya Boleh Mencipta Lajur Ketinggian Sama dengan CSS?

Lajur Ketinggian Sama dengan CSS

Dalam kod anda, anda menggunakan reka letak jadual untuk mencipta lajur ketinggian yang sama. Walau bagaimanapun, teknik ini tidak berfungsi dengan peratusan, kerana lebar setiap lajur ditentukan oleh jumlah bilangan lajur.

Flexbox Solution

Untuk mencapai ketinggian yang sama lajur, anda boleh menggunakan flexbox. Berikut ialah contoh:

ul {
  display: flex; /* Makes the list items align horizontally */
  align-items: stretch; /* Stretches the list items to full height */
}

Ini akan mewujudkan lajur ketinggian yang sama untuk semua item senarai dalam

elemen, tanpa mengira kandungannya.

Nota:

• Flexbox berfungsi hanya pada anak langsung bekas flex (dalam kes ini, < ;ul>).
• Memohon ketinggian pada item lentur akan mengatasi ketinggian yang sama ciri.
• Lajur ketinggian yang sama digunakan hanya pada item pada baris yang sama.

Sokongan Penyemak Imbas

Flexbox disokong secara meluas dalam pelayar moden, dengan pengecualian IE di bawah versi 10. Untuk memastikan keserasian, pertimbangkan untuk menggunakan awalan vendor untuk yang lebih lama pelayar.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mencipta Lajur Ketinggian Sama dengan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!