Bagaimanakah Saya Boleh Mencapai 100% Ketinggian Elemen Kanak-Kanak Dalam Induk Ketinggian Boleh Ubah?

Mencapai 100% Ketinggian Kanak-kanak dalam Ibu Bapa yang Berbeza-beza

Dalam susun atur berbilang lajur, memastikan lajur navigasi sejajar secara menegak dengan kandungan utama adalah penting. Walau bagaimanapun, tanpa menyatakan ketinggian ibu bapa, ini boleh terbukti mencabar.

Penyelesaian:

Gunakan sifat paparan flex pada elemen induk. Ini membolehkan kanak-kanak melentur dan mengembang secara menegak, menduduki ketinggian ibu bapa.

.parent {
  display: flex;
}

Sifat Tambahan:

• item sejajar: regangan; menetapkan elemen kanak-kanak untuk meregang secara menegak dalam induk.
• arah lentur: lajur; menjajarkan elemen anak secara menegak (nilai lalai).

Contoh:

.parent {
  display: flex;
  align-items: stretch;
}

.child {
  height: 100%;
  width: 50%;
}

Nota:

• Awalan untuk keserasian merentas pelayar disyorkan.
• Memastikan bahawa elemen induk mempunyai beberapa ketinggian adalah penting untuk penjajaran menegak yang betul.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mencapai 100% Ketinggian Elemen Kanak-Kanak Dalam Induk Ketinggian Boleh Ubah?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!