Compatibilità tra IE e FF.

positano

Compatibilità tra IE e FF.

C'è un sitema per redere una pagina fatta coi css che sia compatibile coi du browser? Ovvero fatta una pagina con IE funziona egregiamente, mentre con FF i box risultano essere spostati dando confusione alla pagina stessa, c'è un sitema per ovviare a tutto questo?
Ciao

positano

Il problema e che ho creato una pagina composta da tanti box divisi da spazio ..... anzi ti posto l'indirizzo così si fa prima

http://www.web-vacanze-lazio.com/adsense/index.htm

p.s.
sono prove che sto facendo.

esteban

capita spesso che non è il problema di css, ma di qualche

(che FF non sopporta), qualche width nel posto sbagliato etc.....
controlla prima il codice poi quando è pulito prova con i css.
Ti parlo per esperienza personale.
ciao ste

massy

ma di qualche

(che FF non sopporta)
Cioè?

positano

Nulla da fare ho eliminato i

, ho controllato il resto nel file css ma non vedo nulla di storto :bho:
Aiutooooooooo

massy

Prima di incolpare i vari browser, io darei uno sguardo al codice.


<div id="bannertop3">



![image](immagini/Positano%20colle.JPG)</p>
</div>

questo ad esempio che senso ha un paragrafo in un blocco in cui c'è una sola immagine?


<div id="marquee">
  <p align="center"><h1>
	<MARQUEE> etc etc

Questo è onestamente osceno. Probabilmente sarà pure comodo per pompare qualche key ma parlando a livello di scripting nun se po vedè.

Detto questo, rifarei il tutto senza quei posizionamenti assoluti imho inutili.

Il tuo è praticamente un sito formato da un header in alto e da due colonne, a larghezza tra l'altro fissa.

Dividiti gli spazi. Poi li riempi con i tuoi contenuti.

Un esempio potrebbe essere:


<html>
<html>
<head>
<title>Titolo</title>
	<style type="text/css">
		body &#123;text-align:center; font-family&#58;Verdana, sans-serif; font-size&#58;0.8em;&#125;
		#header &#123;width&#58;760px; margin&#58;0 auto; background&#58;red; &#125;
		#cont &#123;width&#58;760px; margin&#58;0 auto; &#125;
		#left &#123;float&#58; left; background&#58;none; width&#58;120px; &#125;
		#contenuto &#123;float&#58; left; background&#58;blue; width&#58;640px; &#125;
		#spot &#123;float&#58;right; background&#58;green; width&#58;300px; height&#58;120px; padding&#58;0 1em 1em 0; margin-left&#58;1em; &#125;
	</style>
</head>

<body>
	<div id="header"> Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc., li tot Europa usa li sam vocabularium. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe al desirabilit? de un nov lingua franca&#58; on refusa continuar payar custosi traductores. It solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles. 
</div>
	<div id="cont">
		<div id="left"> barra sinistra </div>
		<div id="contenuto"><h1>prova</h1> <div id="spot">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod</div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. </div>
	</div>
</body>
</html>

da sviluppare ovviamente con i tuoi contenuti

dead

il problema è che purtroppo Iexplorer non rispetta le direttive del W3C, ed i fogli di stile li interpreta a modo suo.
Per ovviare ricorrerei a due fogli di stile tramite i commenti condizionali.

vedi qui.

positano

@massy said:

Prima di incolpare i vari browser, io darei uno sguardo al codice.
<div id="bannertop3">

</p>
</div>
questo ad esempio :-| che senso ha un paragrafo in un blocco in cui c'è una sola immagine?
<div id="marquee">
<p align="center"><h1>
<MARQUEE> etc etc
Questo è onestamente osceno. Probabilmente sarà pure comodo per pompare qualche key ma parlando a livello di scripting nun se po vedè.  :fumato: 

Detto questo, rifarei il tutto senza quei posizionamenti assoluti imho inutili.

Il tuo è praticamente un sito formato da un header in alto e da due colonne, a larghezza tra l'altro fissa.

Dividiti gli spazi. Poi li riempi con i tuoi contenuti.

Un esempio potrebbe essere:
<html>
<html>
<head>
<title>Titolo</title>
<style type="text/css">
body {text-align:center; font-family:Verdana, sans-serif; font-size:0.8em;}
#header {width:760px; margin:0 auto; background:red; }
#cont {width:760px; margin:0 auto; }
#left {float: left; background:none; width:120px; }
#contenuto {float: left; background:blue; width:640px; }
#spot {float:right; background:green; width:300px; height:120px; padding:0 1em 1em 0; margin-left:1em; }
</style>
</head>

<body>
<div id="header"> Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc., li tot Europa usa li sam vocabularium. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe al desirabilit? de un nov lingua franca: on refusa continuar payar custosi traductores. It solmen va esser necessi far uniform grammatica, pronunciation e plu sommun paroles.
</div>
<div id="cont">
<div id="left"> barra sinistra </div>
<div id="contenuto"><h1>prova</h1> <div id="spot">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nmy nibh euismod</div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. </div>
</div>
</body>
</html>
da sviluppare ovviamente con i tuoi contenuti  :)

Purtroppo non sono molto in gamba coi css , sto incominciando ad incorniciare la cosa per la prima volta, i vari commenti che tu citi "pompare le key ....." l'ho fatto involontariamente per un troppo copia ed incolla che ho fatto per varie prove che sto facendo, cmq ti ringrazio per il templates allegata alla presente, sei praticamente fantastico, vuol dire che ti infastidirò più spesso se la cosa non ti infastidiscem, proverò e farò sapere
p.s.
Un templettino da qualche parte da reperire per la struttura che cercadno di fare???

esteban

fate una prova...

prendete un paragrafo e contenetelo con <h1></h1> e ed un altro con

</p>

con ie solo il paragrafo con H1 crea una riga in più sotto al paragrafo mentre con P no, con FF crea la riga con tutti e due i tag.
come questo es ce ne sono svariati (che naturalmente non mi vengono in mente), io ci litigo spesso per fare in modo che si vedano allo stesso modo su entrambi i browser.

positano

@esteban said:

fate una prova...

prendete un paragrafo e contenetelo con <h1></h1> e ed un altro con

</p>

con ie solo il paragrafo con H1 crea una riga in più sotto al paragrafo mentre con P no, con FF crea la riga con tutti e due i tag.
come questo es ce ne sono svariati (che naturalmente non mi vengono in mente), io ci litigo spesso per fare in modo che si vedano allo stesso modo su entrambi i browser.
Farò anche questa prova caro esteban, cmq sto provando quanto mi diceva ovvero quanto scriveva massy bhe per adesso la semplicità e la correttezza sembra essere disarmante.