Compatibilità browser I.E. ver. 6

[ubbicom]

Ciao a tutti.

Ho uno stranissimo problema con una pagina web costruita con un foglio di stile su tre colonne: una sinistra, una centrale ed una destra.

Facendo una serie di test tra i vari browser in circolazione la pagina web si visualizza correttamente e perfettamente centrata su tutti i browser provati, tranne che su IE 6 con il quale la colonna destra ( inc_right.asp ) finisce sotto la colonna sinistra ( inc_left.asp ).

Ho provato a cambiare la risoluzione video del pc, a cambiare alcuni dei valori ( larghezza, etc ) del foglio di stile che le tre colonne richiamano, ma non c'è stato niente da fare: su IE 6 la colonna destra ( inc_right.asp ) finisce SEMPRE sotto la colonna sinistra ( inc_left ).

E' come se leggesse un "vai a capo" che in realtà non esiste.

Cosa posso fare di più?
Grazie

[fcaldera]

Originariamente inviato da ubbicom
Cosa posso fare di più?
Grazie

sicuramente postare un link per vedere la pagina in questione

controlla comunque:
1) che la somma delle larghezze + padding + margin delle tre colonne non superi la larghezza del contenitore che le racchiude
2) di aver messo anche display: inline ai vari elementi con float: left (o right) soprattutto se hanno anche un margine impostato

[ubbicom]

Grazie x la risposta.

Purtroppo al momento online non ho nulla, sviluppo in locale.

Provo a postare la porzione di css che ho previsto nella terza colonna ( inc_right.asp )

.right {
	background-attachment: scroll;
	background-image: url(/casting/images/right_bg.jpg);
	background-repeat: repeat-y;
	margin: 0px;
	float: left;
	height: 665px;
	width: 232px;
	padding-top: 30px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 35px;
}
.right_textarea {
	font-family: Arial;
	font-size: 12px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #464646;
	text-decoration: none;
	margin: 0px;
	float: left;
	width: 232px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
}
.gallerypic1 {
	background-image: url(/casting/images/gallery1.jpg);
	background-repeat: no-repeat;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 90px;
	width: 120px;
}
.gallerypic2 {
	background-image: url(/casting/images/gallery2.jpg);
	background-repeat: no-repeat;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 90px;
	width: 120px;
}
.gallerypic3 {
	background-image: url(/casting/images/gallery3.jpg);
	background-repeat: no-repeat;
	margin: 3px;
	padding: 0px;
	float: left;
	height: 90px;
	width: 120px;
}
.button1 {
	font-family: Arial;
	font-size: 11px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000000;
	text-decoration: none;
	background-image: url(/casting/images/viewmore.jpg);
	background-repeat: no-repeat;
	margin: 5px;
	float: left;
	height: 17px;
	padding-top: 2px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	width: 68px;
}
.right_headarea {
	font-family: Georgia;
	font-size: 22px;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #7e8901;
	text-decoration: none;
	margin: 0px;
	float: left;
	width: 232px;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
}

E la relativa pagina web:

<div class="right">
     <div class="h2">Album</div>
     
     <div class="gallerypic1"></div>
     <div class="gallerypic2"></div>
     <div class="gallerypic3"></div>
     
     
     <div class="right_textarea">
       <div align="center">Foto</div>
     </div>  
     
     <div class="right_headarea">Web </div>     
     <div class="right_textarea">
			<table border="0">
				<tr>
					<td class="h3">01</td>
					<td class="h4">02</td>
				</tr>    
			</table>
                   
			
    </div>          
     <div class="right_textarea">
       <div align="center">Apri</div>
     </div>
   </div>
 </div>

[arx707]

Se il problema si presenta solo su IE6, potresti anche valutare di abbandonarlo, dal momento che sono sempre di più i soggetti che hanno eliminato del tutto il supporto a tale browser.
Se puoi farlo o no, dipende molto dal tipo di persone che visitano il sito

[Strep]

nel tuo css manca display:inline agli elementi che flottano per cui ie6 raddoppia il margine e le colonne cadono.
Ciao

[ubbicom]

Originariamente inviato da Strep
nel tuo css manca display:inline agli elementi che flottano per cui ie6 raddoppia il margine e le colonne cadono.
Ciao

Grazie, ma in che punto del CSS devo dichiarare display:inline?
Dove trovo documentazione in merito?

[fcaldera]

Originariamente inviato da fcaldera
2) di aver messo anche display: inline ai vari elementi con float: left (o right) soprattutto se hanno anche un margine impostato