posizionamento box

[Isma75]

buongiorno,
vorrei creare un box con un form di login al centro della mia pagina html.
ho cercato qualche esempio e ne ho trovato uno.
Lo sto studiando, ma vorrei capire tutte le istruzioni.
In particolare vorrei sapere quali sono i parametri che mi permettono di specificare con precisione la posizione del
box.
In aggiunta qualcuno mi potrebbe spiegare questa riga di codice, in particolare l'ultimo pezzo relativo al margine.
code { font:80% verdana,helvetica,sans-serif; display:block; margin:0 1em .5em 1em; }

vi ringrazio
Ismael

[rebelia]

Originariamente inviato da Isma75
buongiorno,
vorrei creare un box con un form di login al centro della mia pagina html.
ho cercato qualche esempio e ne ho trovato uno.
Lo sto studiando, ma vorrei capire tutte le istruzioni.
In particolare vorrei sapere quali sono i parametri che mi permettono di specificare con precisione la posizione del
box.

dovresti postarci il codice, altrimenti ci e' difficile spiegartelo

code { font:80% verdana,helvetica,sans-serif; display:block; margin:0 1em .5em 1em; }

diciamo che il div che contiene il tuo form si chiami "divform" (sic, la fantasia!); ti riscrivo il codice con i comandi completi (le scritte tra /* e */ sono i commenti)

#divform {      /* 1 */
   font-size: 80%; /* 2 */
   font-family: verdana, helvetica, sans-serif; /* 3 */
   display: block;  /* 4 */
   margin-top: 0px; /* 5 */
   margin-right: 1em; /* 6 */
   margin-bottom: 0.5em; /* 7 */
   margin-left: 1em; /* 8 */
   }

1. il cancelletto determina che si tratta di un id e non di una classe e ci dice qual'e' quello a cui ci si riferisce
2. la grandezza della font e' dell' 80% rispetto a quella "normale"
3. sara' usata la font verdana, in sua assenza l'helvetica, in sua assenza una font a bastoncino
4. gli elementi sono inline (come lo span) o blocco (come il div o il paragrafo); se lo voglio trasformare, devo usare display: block per gli elementi inline e display: inline per gli elementi blocco
5. il margine in alto e' di 0px
6. il margine destro e' di 1em, che e' la stessa cosa che scrivere 1%
7. il margine inferiore e' di 0,5 em, quindi 0,5%
8. il margine sinistro e' di 1em, cioe' 1%

per centrare un elemento rispetto ad un altro, devi dare text-align: center; all'elemento contenitore (hack per internet explorer) e devi dare margin: 0px auto; (0px in cima e margine automatico a dx e sx) all'elemento da centrare (per centrarlo in tutti gli altri browser)

spero di essere stata sufficientemente chiara

[Isma75]

grazie!
una cosa però, per centrare il box all'interno della pagina del browser scrivendo margin:0px auto come devo impostare top e left del contenitore? posso ometterle?

grazie

Ismael

[rebelia]

se il contenitore e' posizionato in un posto particolare, gli puoi dare top e left, se ti serve, ma per centrarci DENTRO un elemento, devi dare al contenitore text-align: center per ie e margin: auto per gli altri; in questo modo posizioni il contenuto rispetto al contenitore