CSS -uitleg - breedte en maksimum breedte
Gebruik breedte, maksimum breedte en marge: outomaties;
Soos in die vorige hoofstuk genoem; 'n blokvlak-element neem altyd die volle wydte wat beskikbaar is (strek uit na links en regs so ver dit kan).
Deur die width
van 'n blokvlak-element te stel, sal dit verhoed dat dit tot by die rande van sy houer uitstrek. Dan kan jy die kantlyne op outomaties stel om die element in sy houer horisontaal te sentreer. Die element sal die gespesifiseerde breedte opneem, en die oorblywende spasie sal gelykop tussen die twee kantlyne verdeel word:
Let wel: Die probleem met <div>
bogenoemde kom voor wanneer die blaaiervenster kleiner is as die breedte van die element. Die blaaier voeg dan 'n horisontale skuifbalk by die bladsy.
Deur max-width
eerder in hierdie situasie te gebruik, sal die blaaier se hantering van klein vensters verbeter. Dit is belangrik wanneer 'n webwerf op klein toestelle bruikbaar gemaak word:
Wenk: Verander die grootte van die blaaiervenster na minder as 500px breed, om die verskil tussen die twee divs te sien!
Hier is 'n voorbeeld van die twee divs hierbo:
Voorbeeld
div.ex1 {
width: 500px;
margin:
auto;
border: 3px solid #73AD21;
}
div.ex2 {
max-width: 500px;
margin: auto;
border: 3px solid #73AD21;
}