margin-top non va

[Zippo]

Ciao,
sto iniziando ad usare i css ma ancora non ne capisco molto...
Quello che voglio ottenere è un'immagine di sfondo non ripetuta, e fin qui tutto ok. Quello che non mi riesce è allineare in alto il contenuto (un'altra immagine) del body.

Questo è il codice:

<STYLE TYPE="text/css">
BODY { 
background: url(sfondo.gif) #F7F7F1 no-repeat 
margin-top: 0px
}
</STYLE>

Forse il margin-top scritto così si riferisce all'immagine di sfondo e non al contenuto del body? :master:

help

[thomas_anderson]

ciao!
innanzitutto il codice va scritto usando solo lettere minuscole. Il codice da te scritto si riferisce al margine superiore del body. Per spostare l'immagine di sfondo devi usare la proprietà background-position. Esempio:

 body {
  background: #F7F7F1 url(sfondo.gif) no-repeat top left;
}

Se vuoi usare più immagini per il body, sappi che con i CSS di secondo livello cio non è possibile (lo sarà solo con i CSS3). Puoi ovviare a questa situazione usando il background di altri elementi, come gli headers o i <div> usando la stessa proprietà espressa sopra. Esempi molto potenti di questa tecnica li trovi su http://www.csszengarden.com/

[Zippo]

Ma allineare il body in alto è ciò che voglio fare....non voglio allineare il background! Solo che così come ho scritto non funziona...eppure mi pare corretto.

[thomas_anderson]

Devi solo scrivere nel CSS:

body {
margin: 0;
}

[Zippo]

Già provato, non và. La cosa curiosa è che se nel codice metto prima il margine poi il background

BODY {
margin: 0px
background: url(sfondo.gif) #F7F7F1 no-repeat
}

il body risulta allineato in alto come voglio....ma senza l'immagine di sfondo!
Al contrario se metto prima il background...

BODY {
background: url(sfondo.gif) #F7F7F1 no-repeat
margin: 0px
}

vedo lo sfondo ma il body non risulta allineato in alto.



A questo punto mi viene il dubbio, non conoscendo bene l'html, che abbia tralasciato qualcosa di fondamentale e scontato...non devo scrivere niente nel tag del body vero? Il codice che ho postato va messo nell'head e da lì dovrebbe funzionare tutto, giusto?

[edy72]

forse perché manca il punto e virgola alla fine delle dichiarazioni del css:

body {
margin: 0px; 
background: url(sfondo.gif) #F7F7F1 no-repeat; 
padding: 0; /* meglio azzerare anche il padding oltre 
al margin */ 
}

ciao!!

[Zippo]

Esatto!

Grazie mille.