Encore un problème dont je ne trouve pas la solution...
Je gère un système simple de news dont la gestion se fait par un tableau.
Pour afficher des détails rapidement, j'ai un script javascript d'affichage/masquage de l'ID d'une ligne contenant les détails de la news qui s'exécute au click sur un bouton, et qui fait la largeur des 6 cellules de la ligne précédente.
Sous IE, tout est parfait, par contre, sous Firefox, ma seconde ligne fait la largeur de la première cellule et non des 6... comme le montre la capture suivante !
Donc voici le code HTML résultant pour l'entete et les premières lignes du tableau (les autres étant sur le même modèle) :
Code : Tout sélectionner
<table id="news">
<tr class="entete">
<td class="entete_news_id">
#Id
</td>
<td class="entete_news_date">
Date
</td>
<td class="entete_news_auteur">
Auteur
</td>
<td class="entete_news_titre">
Titre
</td>
<td class="entete_news_portee">
Portée
</td>
<td class="entete_news_action">
Actions
</td>
</tr>
<tr class="ligne1">
<td class="news_id">
8
</td>
<td class="news_date">
2008-08-26 16:50:03
</td>
<td class="news_auteur">
admin
</td>
<td class="news_titre">
les n°1 c'est nous !
</td>
<td class="news_portee">
Tous
</td>
<td class="news_action">
<a href="#" onclick="javascript:afficheId('news8')" class="lien_bouton_action" title="Voir la news" alt="Voir la news"><img src="../../themes/classic/images/voir.png" /></a>
<a href="../../pages/news/ajt_news.php?news=8&operation=Modifier la news" class="lien_bouton_action" title="Modifier la news" alt="Modifier la news"><img src="../../themes/classic/images/modifier.png" /></a>
<a href="../../pages/news/sup_news.php?news=8" class="lien_bouton_action" title="Supprimer la news" alt="Supprimer la news"><img src="../../themes/classic/images/supprimer.png" /></a>
</td>
</tr>
<tr class="ligne1" id="news8">
<td colspan="6" class="news_contenu">
dsfljdsqmf <br />
dflmkj mj <br />
Test UTF-8<br />
A la pêche cet été nous en avons eu pour plusieurs euros.. (€ à é è ë ô)
</td>
</tr>
, c'est principalement de la colorisation.Voici le code du fichier css :
Code : Tout sélectionner
div#les_news {
margin: auto;
margin-top: 10px;
margin-bottom: 20px;
width: 900px;
text-align: center;
}
div#barre_boutons_news {
margin: auto;
margin-right: 50px;
margin-top: 10px;
margin-bottom: 15px;
font-size: 14px;
text-align: right;
}
div#tableau_news {
clear: both;
margin: auto;
margin-bottom: 10px;
padding: 0;
text-align: center;
}
.ligne1 {
background-color: #B88C5B;
font-size: 12px;
}
.ligne2 {
background-color: #8D6237;
font-size: 12px;
}
/* Entetes */
.entete {
background-color: #5E3C21;
font-size: 15px;
font-style: bold;
color: white;
text-align: center;
padding: 0px;
}
.entete_news_id {
width: 30px;
border: 1px solid #ffffff;
padding: 1px;
}
.entete_news_date {
width: 130px;
border: 1px solid #ffffff;
padding: 1px;
}
.entete_news_auteur {
width: 120px;
border: 1px solid #ffffff;
padding: 1px;
}
.entete_news_titre {
width: 250px;
border: 1px solid #ffffff;
padding: 1px;
}
.entete_news_portee {
width: 120px;
border: 1px solid #ffffff;
padding: 1px;
}
.entete_news_action {
width: 100px;
border: 1px solid #ffffff;
padding: 1px;
}
/* Contenu */
.news_id {
width: 30px;
border: 0px solid #ffffff;
text-align: center;
padding-left: 5px;
padding-right: 5px;
}
.news_date {
width: 130px;
border: 0px solid #ffffff;
text-align: center;
padding-left: 5px;
padding-right: 5px;
}
.news_auteur {
width: 120px;
border: 0px solid #ffffff;
text-align: center;
padding-left: 5px;
padding-right: 5px;
}
.news_titre {
width: 250px;
border: 0px solid #ffffff;
text-align: left;
padding-left: 5px;
padding-right: 5px;
}
.news_portee {
width: 120px;
border: 0px solid #ffffff;
text-align: center;
padding-left: 5px;
padding-right: 5px;
}
.news_contenu {
width: 100%;
border: 0px solid #ffffff;
text-align: left;
padding-left: 5px;
padding-right: 5px;
}
.news_action {
width: 100px;
border: 0px solid #ffffff;
text-align: center;
padding-left: 5px;
padding-right: 5px;
}Je commence à ne plus avoir de cheveux...
Merci d'avance pour votre aide.
Cordialement.
(les autres aussi... mais c'est Sadeq qui a donné la solution 