28172 sujets

CSS et mise en forme, CSS3

Bonjour,

je rencontre un p'tit problème concernant les tableaux sous IE.

Alors, voila, j'ai la structure suivante :


<table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>
              <th width="20" height="20" scope="col"><img src="coin_g.png" class="coins_g" /></th>
              <th width="20" height="20" bgcolor="#022857" scope="col"><img src="newspaper_go.png" /></th>
              <th bgcolor="#022857" scope="col" align="left"><h3 class="Style1">Autres articles gratuits</h3></th>
              <th width="20" height="20" scope="col"><img src="coin_d.png" class="coins_g" /></th>
            </tr>
            <tr>
              <td colspan="4" bgcolor="#FFFFFF" style="border: 1px dotted #022857 ;padding-left: 5px;">
              			<?php foreach ($news_gratuites as $news): ?>
						<p><strong><?php echo strftime('%d/%m',strtotime($news['created'])) ?></strong> : 
							<a href="http://monsite/?id=<?php echo $news['id'] ?>">
							<?php echo $news['title']; ?>
							</a>
						</p>
						<?php endforeach; ?>
                        </td>
                        </tr>
                     </table>


Bon, alors désolé pour ce code horrible, c'est Dreamweaver qui me l'a pondu. D'habitude j'utilise uniquement les CSS et je sépare vraiment tout, mais aujourd'hui je n'avais pas le choix.
Pareil, je n'utilise pas les tableaux, mais ici c'est pour assurer une présentation et une compatibilité maximal pour une newsletter.

Sous FF, pas de souci, mais sous IE voici le résultat :

http://www.monsterup.com/upload/1241540381413.jpg

Au niveau des styles en rapport :


/* Pour le titre */
h3 {
	margin: 0;
	padding: 0;
	height: 20px;
	line-height: 1.2;
	font-weight: bold; /* Valeur par défaut. (6) */
	font-style: normal;
	font-size: 1.25em;
}
img.coins_g, img.coins_d {
	width: 20px;
	height: 22px;
}
.Style1 {color: #FFFFFF}


En fait, dés que je rajoute du contenu (dans le dernier td, prévu à cet effet), IE me casse tout le tableau.

Voila, si quelqu'un peu m'expliquer la subtilité d'interprétation de IE à ce niveau là Smiley smile

Merci d'avance !
Modifié par supertino7 (05 May 2009 - 18:41)
J'ai trouvé Smiley smile

Il manquait une proprieté "width" pour le 3eme <th> , celui qui est censé être extensible, puisqu'il contient le titre de l'encadré.
Sous firefox c'est ok, mais sous IE, la taille de ce dernier ne s'adapte pas automatiquement.

J'ai mis un 100% et c'est nickel Smiley smile
Modifié par supertino7 (06 May 2009 - 11:25)