Kā panākt, lai div nav lielāks par tā saturu?

Jums ir nepieciešams bloka elements, kuram ir tā sauktais CSS sašaurinājums līdz platumam, un specifikācijā nav sniegts svētīgs veids, kā to iegūt. CSS2 versijā "shrink-to-fit" nav mērķis, bet gan līdzeklis, lai risinātu situāciju, kad pārlūkprogrammai "ir" jāiegūst platums no tukša gaisa". Šādas situācijas ir:

• float
• absolūti pozicionēts elements
• inline-block elements
• tabula elements

ja nav norādīts platums. Es dzirdēju, ka viņi domā par to, kā pievienot to, ko vēlaties CSS3. Pagaidām iztiekiet ar vienu no iepriekš minētajiem.

Lēmums neatklāt šo funkciju tieši var šķist dīvains, taču tam ir pamatots iemesls. Tas ir dārgi. Samazināšana, lai pielāgotos, nozīmē formatēšanu vismaz divas reizes: nevar sākt formatēt elementu, kamēr nav zināms tā platums, un nevar aprēķināt platumu, neizmantojot visu saturu. Turklāt elements nav nepieciešams tik bieži, kā varētu domāt. Kāpēc jums ir nepieciešams papildu div ap tabulu? Varbūt jums ir vajadzīgs tikai tabulas virsraksts.

Nezinu, kādā kontekstā tas parādīsies, bet uzskatu, ka CSS stila īpašība float vai nu left, vai right radīs šādu efektu. No otras puses, tam būs arī citi blakusefekti, piemēram, teksta pludināšana ap to.

Lūdzu, labojiet mani, ja es kļūdos, tomēr es neesmu par to 100% pārliecināts un pašlaik pats to nevaru pārbaudīt.

Ar CSS2 saderīgs risinājums ir izmantot:

.my-div
{
    min-width: 100px;
}

Varat arī pludināt savu div, kas piespiedīs to būt pēc iespējas mazākai, bet jums būs jāizmanto clearfix, ja kaut kas jūsu div ir peldošs:

.my-div
{
    float: left;
}