Mengapakah `lebar: auto` tidak berfungsi seperti yang diharapkan untuk medan `` dan bagaimana saya boleh menjadikannya memenuhi ruang yang tersedia?

lebar:auto Gelagat untuk Medan

Soalan:

Walaupun jangkaan width:auto untuk elemen peringkat blok akan membenarkan elemen mengisi ruang yang tersedia, ia nampaknya tidak berfungsi seperti ini cara untuk elemen. Jelaskan takrif width:auto dan cadangkan penyelesaian untuk mencapai tingkah laku yang diingini iaitu mengisi ruang yang tersedia untuk medan.

Jawapan:

Lebar elemen dikira berdasarkan atribut saiznya, bukan sifat gaya lebar. Nilai saiz lalai menentukan lebar auto awal.

Untuk mencapai gelagat yang diharapkan untuk mengisi ruang yang tersedia, cuba tetapkan lebar:100% dan bukannya lebar:auto.

Contoh:

<code class="html"><form action="" method="post" style="width:200px;background:khaki">
  <input style="width:100%" />
</form></code>

Nota Tambahan:

Untuk memperhalusi lebar lagi, tambah jidar dan jidar negatif untuk membatalkan jidar dan sempadan lalai yang digunakan oleh pelayar. Ini memastikan ketekalan merentas penyemak imbas yang berbeza, kecuali dalam Internet Explorer, yang menggunakan sempadan secara berbeza.

Atas ialah kandungan terperinci Mengapakah `lebar: auto` tidak berfungsi seperti yang diharapkan untuk medan `` dan bagaimana saya boleh menjadikannya memenuhi ruang yang tersedia?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!