Spazio fra due Immagini "una sopra l'altra"

[^_^M@ttia^_^]

Avendo cambiato la dichiarazione iniziale del mio sito da XHTML Transitional a XHTML Strict (ed aver convertito tutto ovviamente, anche grazie ad un aiuto dal Forum), mi ritrovo con un ultimo problemino sorto proprio quando ho cambiato il doctype iniziale:

con il seguente codice (ovvero due immagini una sopra l'altra):

[img]Immagine.jpg[/img]

[img]Immagine.jpg[/img]

Con il transitional non lascia spazi, ma le "salda" perfettamente fra loro, mentre con Strict mi lascia un odiosissimo spazio fra le due!

Quale codice va quindi esplicitato nello strict per ottenere lo stesso effetto che il transitional fa senza niente! (nel css è già presente il pezzetto

img
{
border: none;
margin: 0px;
}

(P.S. con IE non fa spazi, ma con Firefox, ecc. sì!)

[Mich_]

Il
non ci andrebbe.

Pero` allora le img devono avere display:block; , altrimenti si affiancano.

Se le immagini devono montarsi esattamente (sono cioe` due pezzi della stessa immagine), conviene racchiuderle dentro un unico <div>, e in tal caso occorre specificare
margin:0;
padding:0;
border:0;

Concludendo.
Anzitutto bisogna che il codice XHTML rispecchi la logica degli elementi della pagina; il CSS lo si sistema dopo; ci sono i mezzi per ottenere l'effetto voluto.

[^_^M@ttia^_^]

Eh l'esempio delle due immagini col
era solo un esempio facile: accade con tutte le immagini...

Guarda il mio sito QUI e poi aprilo con IE e capirai cosa intendo...

[Mich_]

Non posso caricare IE: non esiste la versione sotto linux.

Ho comunque dato un'occhiata alla pagina, ma non ho trovato due immagini che devono avvicinarsi in verticale.

Ho pero` notato che la pagina e` realizzata con oggetti semanticamente sbagliati: questo provoca l'impossibilta` di leggerla con browser non visuali, e l'errata indicizzazione nei motori.

In pratica: formalmente usi XHTML Strict; la struttura e` tipica da HTML2.

Sono fortemente convinto, che se facessi il passo dell'uso di strutture semantiche corrette, sarebbe piu` semplice correggere anceh i probelmi di CSS.

[^_^M@ttia^_^]

Eh lo so, soltanto che non ho il tempo da deicarci, x adesso mi serviva sol orisolvere quel piccolissimo problema, poi quanto avrò tempo rivedo il tutto...

Comunque ecco due screen x spiegare:

Con Firefox (XHTML Strict):


Con IE (Strict) o qualsiasi altro con Transitional:

[Mich_]

Il problema mi pare siano le tabelle.

Non sono andato a vedere se le "rotture" sono tra due <tr> o tra due <table>, ma hai posizionato le tue immagini dentro a celle di tabelle.

Inoltre nelle immagini non hai specificato
border:0;
padding:0;
(il border:none; non necessariamente toglie lo spazio del bordo)

Qualche volta (ma se usi XHTML Strict non dovrebbe succedere) lo spazio (o il carattere acapo) tra la fine di una tabella e l'inizio dell'altra introduce uno spazio nella visualizzazione.

[^_^M@ttia^_^]

No, anche col tuo border e padding non va... Le immagini si trovano in molte strutture (Tabelle, div, ecc.), ma se io imposto il doctype a Transitional non c'è nessuno spazio, mentre mettendolo a strict si creano queli spazi ovunque con le immagini, quindi credevo che il transitional "sottintendesse" qualcosa che invece con lo strict bisogna esplicitamente dichiarare... :master:

[Mich_]

Anzitutto il margin, border e padding vanno messi a zero in tutte le strutture che racchiudono le immagini.
Quindi se le immagini stanno in <tr> diversi, devi metterli nei tag <img>, <td> e <tr>.
Se sono tabelle diverse, anche i tag <table> devono avere quelle dichiarazioni (non sono riuscito a seguire nel tuo codice tutta la struttura).

Non dici in che browser stai testando: IE e altri si comportano in modo diverso, per quanto riguarda gli spazi vuoti.
Per quanto ne so (e leggo nei vari post in questo forum), sistemare per i browser conformi e` piu` semplice che per IE, mentre da quanto ho capito da te sembra viceversa.

Questo mi fa pensare ad errori di sintassi o di semantica.
Hai provato a validare il codice HTML e CSS?