Fino ad oggi eravamo abituati a dare delle dimensioni ben precise ai nostri recipienti <div> usando la proprietà "
width".
Codice: Seleziona tutto
div.esempio1 {
width: 600px;
margin: auto;
border: 3px solid #336699;
}
Ma in un web ormai responsive a 360 gradi, avrete certamente notato quanto sia orribile vedere dei contenuti che escano dalle pagine dei nostri smartphone o tablet.
Ecco che entra in gioco la proprietà "
max-width".
Codice: Seleziona tutto
div.esempio2 {
max-width: 600px;
margin: auto;
border: 3px solid #336699;
}
In questo modo avremo un recipiente che si stringerà insieme al browser e che si allargherà fino ad una misura massima (nell'esempio di 600 pixel).
