Disposizione lista...

[ALonE]

Ciao a tutti ho questo codice html

<div id="Right">
	<ul>
		[*][img]../img1.jpg[/img]
		[*][img]../img2.jpg[/img]
		[*][img]../img3.jpg[/img]
		[*][img]../img4.jpg[/img]
	[/list]
</div>

che è gestito dal codice css:

 #Right{
	background-color:#CCCCCC;
	width:347px;
}
#Right ul{
	list-style-type:none;
	margin:0px;
	padding:0px;
	line-height:0px;
}
#Right ul li{
	float:left;
	margin:0px;
	padding:0px;
	margin-left:1px;
}
#Right ul li img{
	border:0px;
}

Ora da impostazioni del css e dall'html mi aspetterei di vedere una cosa tipo:

+------------------------------------------+
|                                          |
|                   IMG1                   |
|                                          |
|                                          |
+-------------+---------------+------------+
|             |               |            |
|    IMG2     |     IMG3      |    IMG4    |
|             |               |            |
+-------------+---------------+------------+

In Firefox vedo la cosa bene, cioè, la prima immagine in alto più grande e quelle più piccole sotto quella più grande, in fila e con un margine di 1px a sinistra tra l'una e l'altra.

Ora su IE putroppo me lo visualizza male, lo spazio verticale le immagini sotto è di 3px e lo spazio a sinistra non è di 1px come da css ma di 2px, rovinando la grafica mandandomi ulteriormente a capo l'IMG4.
Vedendo quindi una cosa tipo

+------------------------------------------+
|                                          |
|                   IMG1                   |
|                                          |
|                                          |
+-------------++--------------+------------+
|             ||              |
|    IMG2     ||    IMG3      |
|             ||              |
+-------------++--------------+
|             |
|    IMG4     |
|             |
+-------------+

DOVE SBAGLIO?????

[Mich_]

Le immagini racchiuse in un <a> hanno di default un bordo di 1 px (pero` dipende dal browser).
Dato che mi pare di intuire che vuoi fare una cosa "precisa al pixel", devi eliminare questi default che dipendono dai browser.

Prova a modificare la regola CSS sulle immagini:
img { border:0; margin:0; padding:0; }
in modo da eliminare tutti i bordi alle immagini.
Oppure controlla tutti bordi e margini di tutti gli oggetti coinvolti (ad esempio ti manca per gli oggetti <a>)

[ALonE]

Ho provato facendo

#Right ul li img{
    border:0px;    
    margin:0px;
    padding:0px;
}
#Right ul li a{
    border:0px;    
    margin:0px;
    padding:0px;
} 

Ma non ho ottenuto nessun risultato.

Fatto anche una prova facendo invece:

#Right ul li{
    float:left;
    display:inline;
    margin:0px;
    padding:0px;
    * margin-top:-1px;
    * margin-bottom:-2px;
    margin-left:1px;
} 

con quegli * solo explorer interpreta la riga e ottengo il risultato voluto, anche se mi sembra un accrocchio più che altro

[Mich_]

quel tipo di hack sarebbero da evitare. Funzionano sfruttando erorri interpretativi da parte di alcuni browser, ma non puoi sapere se le prossime versioni avranno gli stessi erorri interpretativi.

meglio e` usare i
Commenti condizionali per IE:
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="ie.css" /> /// oppure qui puoi metterci <style ...>...</style>
<![endif]-->

Oppure: