.content { width: 100%; max-width: 720px; }Conținutul se micșorează cu containerul, dar nu depășește 720px.
LECȚIA 45 DIN 100
Combină width și max-width
Construiește un conținut fluid care nu devine excesiv de lat.
PASUL 1 · ÎNVAȚĂ
Cum funcționează
width: 100% permite cutiei să folosească spațiul disponibil, iar max-width: 720px îi impune o limită superioară pe ecrane mari. Împreună formează un tipar responsive.
.content { width: 720px; }O lățime fixă de 720px poate depăși viewportul unui telefon.
PASUL 2 · APLICĂ
Exercițiul tău
Completează width cu 100% și max-width cu 720px.
index.htmlCSS
Rezultat sigurizolat
Ciorna se păstrează doar în acest browser.HTML și CSS permise · scripturile și rețeaua sunt blocate
PASUL 4 · VERIFICĂ
Ce trebuie să treacă
0%neverificat
- ○Blocul folosește width: 100%.
- ○Blocul este limitat la 720px.
- ○Conținutul țintă este prezent.
Explică-mi logica rezolvării
width oferă dimensiunea preferată, iar max-width o limitează fără a obliga o lățime fixă.