Bagaimanakah Saya Boleh Mencipta Lajur Ketinggian Sama Menggunakan Elemen Terapung dalam CSS?

Mencipta Lajur Sama Tinggi dengan Elemen Terapung

Dalam susun atur halaman yang menampilkan div induk yang mengandungi dua div anak, salah satu div kanak-kanak boleh mempunyai lebih banyak kandungan, menyebabkan div induk mengembang ketinggian. Walau bagaimanapun, div kanak-kanak yang lain mungkin tidak melaraskan ketinggiannya dengan sewajarnya. Isu ini boleh diselesaikan dengan menggunakan sifat CSS tertentu.

Untuk mencapai ketinggian yang sama bagi kedua-dua div kanak-kanak:

1. Elemen Induk:

   • Tambah limpahan: tersembunyi untuk mengelakkan sebarang kandungan daripada tumpah di luar ibu bapa.
   • Tetapkan kedudukan: relatif untuk kedudukan mutlak anak berikut.
   • Gunakan lebar: 100% untuk memastikan ibu bapa merentangi keseluruhan lebar yang tersedia.

2. .anak-kanan Elemen:

   • Tetapkan warna unik untuk analisis visual (cth., latar belakang: hijau).
   • Tetapkan ketinggian: 100% untuk memastikan ketinggian sepadan dengan induk.
   • Gunakan lebar: 50% untuk menetapkan lebar kepada separuh daripada lebar ibu bapa lebar.
   • Tambah kedudukan: mutlak untuk penentududukan mutlak dalam induk.
   • Tetapkan ke kanan: 0 untuk meletakkannya siram pada tepi kanan induk.
   • Set atas: 0 untuk meletakkannya siram pada tepi atas ibu bapa.

Dengan menggunakan sifat CSS ini, kedua-dua div kanak-kanak akan mempunyai ketinggian yang sama, memastikan reka letak yang seimbang dari segi visual.

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