Mengapa Harta `max-width` CSS Saya Meninggalkan Pelapik Berlebihan Selepas Pembalut Teks?

Memahami Pembalut Baris dan Saiz CSS

Dalam CSS, sifat lebar dan lebar maksimum mentakrifkan saiz mendatar sesuatu elemen. Apabila kandungan elemen melangkaui lebar maksimumnya, ia membungkus ke baris seterusnya. Walau bagaimanapun, seperti yang ditunjukkan dalam contoh yang disediakan:

#tooltip { 
    position: absolute;
    width:auto;
    min-width:50px;
    max-width:250px;
    padding:10px;
    background-color:#eee;
    border:1px solid #aaa;
}

Sifat lebar maks kelihatan mengatasi sifat lebar apabila kandungan dibalut ke baris seterusnya, meninggalkan pelapik berlebihan di hujung garisan yang dibalut.

Penjelasan Tingkah Laku Biasa

Tingkah laku ini memang normal. Penyemak imbas cuba mengalirkan teks sebaris dalam elemen sehingga ia mencapai lebar maksimum yang dibenarkan. Jika ia tidak boleh dimuatkan pada baris pertama, ia akan dibalut dan diteruskan pada baris berikutnya.

Walau bagaimanapun, selepas dibalut, kotak itu tidak akan mengecut lagi agar sesuai dengan teks. Ini kerana pembalut teks tidak membenarkan tingkah laku itu. Lebar kotak dikira sebagai nilai lebar maksimum (dalam kes ini, 250px) dan tidak berdasarkan saiz teks yang dibalut.

Penyelesaian Kemungkinan

Malangnya, tiada penyelesaian CSS yang diketahui untuk mengubah tingkah laku ini. Penyemak imbas berfungsi dengan cara ini kerana sifat semula jadi pembalut teks.

Atas ialah kandungan terperinci Mengapa Harta `max-width` CSS Saya Meninggalkan Pelapik Berlebihan Selepas Pembalut Teks?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!