Firefox Inspiegabile!

ivan88

Firefox Inspiegabile!

Ciao a tutti, sono nuovo del forum ma non del sito GT di cui ho letto le preziosissime guide posizionamento e html, che mi hanno aiutato quando ho iniziato a fare il webmaster.

Vi posto il mio problema.
In pratica mi sono convertito ai div+css da un po' e mi trovo benissimo.
Solo che FF legge alcuni comandi diversamente da IE.
Fin qui nessun problema, ho altri siti e sono sempre riuscito a venire a capo dei problemi con FF ma questa volta sto uscendo di testa:x

In pratica FF mi sposta un div sopra un altro e ne annulla lo sfondo senza ragione! Pensavo fosse un problema di padding ma invece no.
E' come se non riconoscesse il primo div **ppheader **di ogni pagina.
Importante: il secondo ppheader viene visualizzato bene!
Questa cosa mi succede in molte pagine ma vi posto la home di esempio.
Il codice:

Html
div id="total">
<div id="menu"></div>
<div id="ppheader"></div>
<div id="primopiano">
<div id="intro">testo</div>
<div id="ppheader"></div>
testo(marquee)
</div>
</div>

CSS
#button {
background-image: url(immagini/button.gif);
background-repeat: no-repeat;
background-color: #0000A0;
width: 250px;
height: 40px;
line-height: 40px;
text-align: center;
border: none;
margin-bottom: 5px;
float: left;
}

#ppheader {
background-image: url(immagini/vetrina.gif);
height: 45px;
line-height: 40px;
color: #000080;
font-size: 45px;
font-family: batang;
text-align: center;
}

#primopiano {
background-color: #F7F7F7;
text-align: center;
}

#intro {
height: 110px;
text-align: justify;
color:;
font-size: 20px;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 5px;
margin-right: 5px;
}

Qualche idea???
Qualsiasi aiuto sarebbe davvero apprezzatissimo!
Grazie mille in anticipo
Ivan;)

jess

Non è Firefox che sbaglia, ma IE.
Non puoi avere due id con lo stesso nome nella stessa pagina. Ti conviene assegnare ppheader come class e non come id e tutto dovrebbe funzionare di nuovo bene.

<div class="ppheader"></div>> .ppheader {
background-image: url(immagini/vetrina.gif);
height: 45px;
line-height: 40px;
color: #000080;
font-size: 45px;
font-family: batang;
text-align: center;
}

ivan88

Grazie del consiglio ma non è questo il problema.
Infatti sostituendo con class rimane uguale sia in IE che in FF. :bho:
Inoltre ho dimenticato di dire che nelle altre pagine dove mi fa questo scherzo c'è un solo id=ppheader!
Mentre nella nostra pagina di esempio completa ce ne sono 4 ( e gli ultimi 3 funzionano perfettamente (sia IE che FF)!

Posto il codice html completo:
<div id="total">
<div id="menu"></div>
<div id="ppheader"></div>
<div id="primopiano">
<div id="intro">Testo</div>
<div id="ppheader"></div>
Marquee
<div id="ppheader"></div>
Marquee
<div id="ppheader"></div>
Marquee
</div>
</div>

Non pensavo che gli altri 2 uguali fossero importanti...
Dovrei sostituire comunque il div col class?

Ad ogni modo grazie mille per la tua risposta.

jess

Può dipendere da tante cose, ma ho bisogno di vedere com'è fatto l'intera pagina. Puoi postare un link ad una delle tue pagine con questo problema?
L'id deve essere comunque unico.

jess

Il primo ppheader viene dopo un button con float left senza che c'è stato un clear.
Se inserisce per il div #primopiano che contiene i ppheader un clear: left o clear: both, tutto torna a posto.

karedas

Ciao Ivan88 hai risolto?

ivan88

Si ho risolto grazie al consiglio di Jess.

Però mi ha sollevato un altro dubbio quello del div unico: io spesso do a più di un div lo stesso id e mi trovo benissimo.

Ad esempio ho una pagina così:
HTML(parziale)
<div id="vetrina">
<div id="vheader"></div>
<div id="ve"><img src="" id="foto"></a><br>Scritta</div>
<div id="ve"><img src="" id="foto"></a><br>Scritta</div>
<div id="ve"><img src="" id="foto"></a><br>Scritta</div> ecc.
</div>

Css(parziale)
#vetrina {
background-color: #F7F7F7;
width: 810px;
height: 580px;
color: #0000A0;
margin-top: 0px;
float:left;
}

#ve {
margin-left: 50px;
margin-top: 30px;
float: left;
}

Io visualizzo la pagina perfettamente sia con IE che con FF.
Però tecnicamente mi hanno detto che è sbagliato.
Mi consigliate di correggerlo comunque?
Se si Come?

Grazie Mille in anticipo
Ivan;)

cali1981

Si è sbagliato, tra le altre cose non valida la apgina in questo modo. come suggerito, puoi cambiare id con class cambiando ovviamente i selector.

ivan88

Grazie mille per gli utili consigli.
Questa cosa dell' id unico vale solo per il div?
Io per sicurezza l' ho tolto anche ai marquee però l' ho lasciato alle foto.
Le foto possono anche avere lo stesso id no?

cali1981

No ovviamente è un discorso generale che vale per qualsiasi tag.

ivan88

Grazie Mille!
Ora il mio sito è scritto senza errori!