Problema CSS cross Browser

**Maritz79** · 24-11-2006, 09:52

Ho un problema di impostazione grafica tra IExplore e Firefox.

Applico il seguente codice a 2 oggetti: un'oggetto contenitore e un'oggetto immagine

codice:

.contenitore
		{
		padding: 0px;
		border: 0px solid #FFFFFF;
		border-collapse:collapse;
		text-align:left;
		background-color:#FFFFFF;
		width:800px;
		}

.banners
		{
		border: 0px solid #FFFFFF;
		}

Il risultato è l'immagine allegata...

In Firefox e Opera 9 si vede come voglio io... in IExplorer invece resta quell'antiestetico bordino bianco nella parte inferiore.

Come ovvio al problema? :master:

**Mich_** · 24-11-2006, 10:03

Posta anche il codice HTML e il DOCTYPE usato.
Sembra comunque che ci siano delle dimensioni (magari definite nell'HTML) che ridimensionano l'immagine e che vengono interpretate in modo diverso nei due browser.

**Maritz79** · 24-11-2006, 11:10

Codesto l'è il DOCTYPE

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Per quanto riguarda il codice

nella pagina è inserito questo codice

codice:

<tr>
<td class="contenitore">
<? include "../parts/footer.php"; ?>
</td>
</tr>

Il file footer.php è semplicemente fatto così:

codice:

[img]../img/footer.jpg[/img]

Come si puo' notare non utilizzo mai dimensionamenti statici di immagini all'interno del codice HTML

**Mich_** · 24-11-2006, 11:54

Non mi mervaiglia piu` di tanto il bordino bianco. Se fai una ricerca in questo forum, trovi uno o due interventi a settimana per margini non fatti bene in IE.

Invece mi meraviglia la variazione di dimensione dell'immagine (a meno che non sia frutto della rielaborazione grafica).

Per il bordino ci sono alcune azioni possibili:
1. provare a dare margin: 0; padding: 0; ad ambedue i blocchi del CSS;
2. dare il colore di sfondo uguale al colore della fine dell'immagine: il bordino c'e` ancora, ma non lo si vede dato che e` del colore dell'immagine;
3. vedere se tra i bachi di IE trovi quello che si verifica: il tipo di errore mi fa pensare al raddoppiamento dei margini o al bug dei tre pixel (tree-pixel-bug) (vedi la sezione degli hack nei "link utili").

**Maritz79** · 24-11-2006, 12:09

La 1° e la 3° soluzione non funzionano.

La 2° purtroppo non la posso applicare.

Faccio ulteriori ricerche in rete per vedere se trovo qualcosa...

**Maritz79** · 24-11-2006, 16:52

Nulla da fare... ho risolto creando una nuova classe con sfondo #999999 e applicandola al footer delle pagine.
Il problema riscontrato è uno spostamento dell'imagine verso l'alto di esattamente 3 pixel.
Essendo un newbye di CSS non so come risolverlo al meglio con le storie delle dimensioni in percentuale.
Per ora mi va più che bene così, approfondirò successivamente la cosa.

**fcaldera** · 24-11-2006, 17:58

scrivi così

codice:

<tr>
<td class="contenitore">
<? include "../parts/footer.php"; ?></td></tr>

in cui il </td> è attaccato a cioò che lo precede...

Discussione: Problema CSS cross Browser

Strumenti discussione

Ricerca discussione

Visualizza

Problema CSS cross Browser

Permessi di invio