Supponiamo di voler vedere il contenuto della nostra pagina centrato rispetto
alla finestra del browser. Come ottenere questo risultato?
Possiamo procedere in due step:
Inseriamo tutto il contenuto da centrare (ad esempio, tutto quello contenuto fra
<body> e </body> all'interno di una scatola, aggiungendo
un blocco DIV. Diamo a questo DIV un'id univoco, con un risultato simile al seguente:
<body>
<div id="contenitore">
[ ... ] contenuto della pagina [ ... ]
</div>
</body>
Aggiungiamo una regola CSS per importare la larghezza di questo blocco, e per fare
in modo che i margini dai bordi vengano calcolati in automatico per centrarlo. Qualcosa
del genere:
#contenitore {
width: 800px;
margin: auto;
}
A questo punto il nostro blocco sarà centrato; possiamo aggiungere un'altezza minima
(min-width), dei bordi (border), uno sfondo, ecc.
Laboratorio di Comunicazione mediante Calcolatore - Leonardo Robol e Sergio Steffè - AA 2019/2020 - PISA
