Problema CSS!

[idkfa46]

Ciao Ragazzi... ancora una volta chiedo il vostro aiuto per risolvere questo nuovo problema:

La home page del sito che sto creando, viene visualizzata correttamente con Explorer, Chrome e Safari ma se utilizzo Mozilla noto un piccolo errore.




Come potete vedere dalle immagini, il primo screen è stato fatto utilizzando Crome e la visualizzazione è corretta, mentre nel secondo , utilizzando Mozilla, i due riquadri risultano appiccicati !

Ora vi posto il codice che ho utilizzato:

<!-- Banners -->  
				<div class="slideGg">
				<div class="btn"><a href="#" class="prev" title="Previous" id="sliderPrev">Previous</a></div>
				<div class="list" style="overflow: hidden;">
					<ul style="width: 636px; margin-left: -212px;" id="sliderWrapper">
                                                <li><a linkindex="86" href="{$script_url}?act=donation" title="donation"><img src="img/banner1.gif" height="80" width="200"></a></li>
                                                <li><a linkindex="87" href="{$script_url}?act=credits" title="credits"><img src="img/banner2.png" height="80" width="200"></a></li>
                                                <li><a linkindex="88" href="{$script_url}?act=referral" title="referral"><img src="img/banner3.png" height="80" width="200"></a></li>
			<li><a linkindex="89" href="{$script_url}?act=mall&cat=item1" title="webshop"><img src="img/banner4.png" height="80" width="200"></a></li>
			<li><a linkindex="90" href="{$script_url}?act=guide" title="features"><img src="img/banner200.png" height="80" width="200"></a></li>
			<li><a linkindex="91" href="{$script_url}?act=vote" title="vote"><img src="img/banner300.png" height="80" width="200"></a></li>

                        					</ul>
				</div>
				<div class="btn"><a href="#" class="next" title="Next" id="sliderNext">Next</a></div>
			</div></p>
                                                 </p>
                            				<div class="slideplayer2">
					<object width="212" height="180"><param name="movie" value="http://www.youtube.com/v/9CUsX4LC1qA&hl=it_IT&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/9CUsX4LC1qA&hl=it_IT&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="230" height="153"></embed></object>
					<object width="212" height="180" border="2"><param name="movie" value="http://www.youtube.com/v/zj-mUj7XWPc?fs=1&amp;hl=it_IT"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/zj-mUj7XWPc?fs=1&amp;hl=it_IT" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="230" height="153" border="2"></embed></object>
					</div>
		
		
		</div>

e il CSS a cui faccio riferimento è:

.slideplayer2{ position:relative; z-index:1; margin-top:+0px; width:468px; height:154px; background:url(../img/sprite_main1.png) no-repeat; padding:14px 10px 14px 14px; overflow:hidden;}

Aumentando il valore di margin-top:+0px sono in grado di visualizzare i riquadri separati anche su Mozilla ma con gli altri browser la spaziatura risulta sempre maggiore...

Come posso fare per risolvere questo problema???
Spero di essere stato sufficientemente chiaro.

Grazie, Matteo

 

[borgo italia]

ciao
due cose:
il tuo codice html si vede un po'incasinato e usa il tag html non codice.
poi prova a togliere <p></p> tra i due div e lavora solo col margin

 

[indalo]

Doppia chiusura

Ha ragione borgo italia.

Oltretutto vedo che il paragrafo lo chiudi due volte senza apertura.

Io non sono un esperto ma forse la cosa nn funzica.

Oltretutto, se non ricordo male, ho letto da qualche parte che margini e padding sono gestiti in modo diverso da Mozzilla e IE.

Ciao.

 

[borgo italia]

ciao

Oltretutto vedo che il paragrafo lo chiudi due volte senza apertura.

infatti non va bene

....margini e padding sono gestiti in modo diverso da Mozzilla e IE

infatti con ie e ff (non so perche non ho verificato con le ultime versioni) dando a un div largezza, margine e padding l'occupazione di spazio è:
per ie il div occupa uno spazio = alla larghezza con all'interno il pad e mar
per ff il div occupa uno spazio =larg+pad+marg
analogo per l'altezza.
come detto non so se con le nuove versioni questo è superato. prima si doveva "sniffare" il bw e prendere le misure adeguate