centrare immagine in un div

[ijewel]

Ciao a tutti, un aiuto perchè non riesco a vedere dove sbaglio...

non riesco a centrare l'immagine nel div, l'immagine viene spostata verso sx invece di esser centrata, nel file css ho definito tutto ciò:width:600px;

background-repeat:no-repeat;
text-align:center;
margin-bottom:0;
margin-left:auto;
margin-right:auto;
padding:0;

potete aiutarmi?
Mille grazie

[Vincent.Zeno]

immagine? nel css non parli di immagini...
tu intendi forse immagine per il background ?

[ijewel]

no, l'immagine l'ho definita nel file html. (purtroppo devo)
il codice html, (scusa non l'ho scritto) è il seguente
<div id="header">[img]platinum.gif[/img]</div>

mille grazie ancora

[webdemo]

sposto in CSS

ciak

[Vincent.Zeno]

usa un div per metterci l'immagine,
poi lo setti così:
div.image {margin: auto; text-align:center}

la seconda voce serve perché IE è parecchio testardo.. anche la versione 7,
nel caso poi aggiusti il posizionamento degli altri contenuti

[ijewel]

non funziona!!! Rimane sempre spostato a dx....

[Mich_]

Posta il CSS realtivo al contenitore dentro cui va centrata l'immagine e all'immagine stessa.
Quanto postato nel primo post non si capisce a cosa si riferisce.

Non serve inserire l'immagine dentro un ulteriore contenitore, mentere puo` essre utile trasformarla in blocco (di default il tag <img> e` di tipo inline).

Poi devi anceh dire in quae browser hai testato, dato che in questo campo si comportano in modo diverso.

[ijewel]

allora, i test li faccio sia su ie6 che su ff

Questo il codice relativo all'html

<div id="header">[img]platinum.gif[/img]</div>

questo il codice css:
#header{
background-repeat:no-repeat;
width:600px;
margin-right:auto;
margin-left:auto;
margin-bottom: 0;
text-align:center;
}

[Mich_]

allora, i test li faccio sia su ie6 che su ff

Si` e come si comporta nei due browser?

Anzitutto se vuoi inserire un oggetto in un altro e centrarlo, l'oggetto esterno deve aver una larghezza definita (ce l'hai).
Poi l'oggetto interno deve avere margini laterali automatici (ti manca)
Inoltre (per far contento IE6), l'oggetto esterno deve avere il text-align: center; (ce l'hai).
Non servono i margini all'oggetto esterno (non per centrare l'immagine nel blocco)

Riassumendo:

#header{
  background-repeat: no-repeat;
  background-image: url(...);        /* altrimenti non ha senso non-ripetere il background */
  width: 600px;
  text-align: center;
}
#header img {
  display: block;
  margin: 0 auto;
  width: ...px;                          /* oppure si possono definire le dimensioni nel tag */
  height: ...px;
}

[ijewel]

Allora.... scusa il ritardo ma non c'ero in questi gg....

Dicevo su entrambi i browser l'immagine la sposta a dx. pur facendo come hai detto tu l'immagine rimane spostata a dx.....

grazie mille per l'aiuto stò impazzendo....