Mengapa Medan Input Tidak Mengisi Ruang Tersedia dengan `lebar: auto`?

Lebar:auto untuk Medan Input

Masalah:

Lebar:auto untuk paparan: elemen blok bertujuan untuk mengisi ruang yang ada. Walau bagaimanapun, untuk medan input, gelagat ini nampaknya tidak konsisten.

Soalan:

1. Apakah sebenarnya maksud width:auto dalam CSS?
2. Adakah terdapat cara untuk menjadikan medan input memenuhi ruang yang tersedia seperti elemen peringkat blok lain?

Jawapan:

1. Maksud lebar:auto:

Lebar input ditentukan oleh nilai lalai atribut saiznya. Lebar:auto menetapkan lebar kepada nilai lalai ini.

2. Mencapai tingkah laku yang diharapkan:

Untuk menjadikan medan input memenuhi ruang yang tersedia, gunakan lebar:100% seperti berikut:

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

Nota: Kaedah ini mungkin tidak berfungsi dengan sempurna dalam semua pelayar kerana perbezaan dalam aplikasi sempadan.

Atas ialah kandungan terperinci Mengapa Medan Input Tidak Mengisi Ruang Tersedia dengan `lebar: auto`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!