[Résolu] <Span> dépasse d'un <div> dans un <td>

résultat ici par exemple : http://www.x86-guide.com/fr/cpu/Intel-Pentium%20Pro-3.html (pbm visible sous FF uniquement. IE OK)

Le Span qui contient le "7" à la ligne "Pentium Pro" du tableau "Sous-types" dépasse sur le titre du menu.
J'ai le problème depuis que j'ai mis le span en float:none pour pouvoir le centré (j'ai pas trouvé d'autre moyen).
En fait je n'arrive pas à rendre le span plus petit, ou le reste de la ligne du tableau plus haute...
Voici le code :

			
echo "
				<tr>
    				<td width=\"50%\" bgcolor=\"#ADB8EB\">
						<span class=\"case_tableau_bleue\">
							<a href=\"".$url_courante."#".$data_sous_type_CPU["nom"]."\" class=\"lien_fond_clair\">".$data_sous_type_CPU["nom"]."
							</a>
						</span>
					</td>
    				<td width=\"50%\" bgcolor=\"#FFFFFF\">
						<div align=\"center\">
							<span class=\"case_tableau_blanche\" style=\"float:none;\">".$nb_cpu_connu_par_sous_type."
							</span>
						</div>
					</td>
  				</tr>";

Si qq'un voit comment résoudre mon petit pbm...

Merci par avance.
Modifié par Mixeur (11 May 2008 - 08:47)

Bonjour,

Donc tu as un élément de type en-ligne, non flottant, avec 3px de padding-top et une couleur de fond blanche. Comme cet élément est en display: inline (par défaut pour un élément span), il s'étale en hauteur à cause du padding sans que cela impacte les dimensions et positions des autres éléments. Donc le span avec sont padding-top: 3px déborde vers le haut. CQFD.

Solution: ne pas appliquer de padding à ce span. Et tout simplement ne pas utiliser d'élément SPAN dans ces cellules de tableau. Et apprendre à mieux se servir des éléments HTML (il manque des TH dans tes tableaux, des classes sur les TD directement et pas sur des SPAN qui dans la plupart des cas n'ont rien à faire là, etc.), et des sélecteurs CSS.

OK, tout rentre dans l'ordre en mettant padding:0px.

Merci bcp Florent.

Pour ce qui est du reste (ne pas utiliser d'élément SPAN dans ces cellules de tableau, apprendre à mieux se servir des éléments HTML et des sélecteurs CSS...), j'y travaille mais c'est un peu long.
Les CSS ne sont pas des choses évidentes, ça n'a très clairement pas été conçu pour être abordable par tous, pas comme le HTML. Même si les codes semblent simples, les principes sont très loin de l'être, et la différente gestion entre IE et FF aggrave encore la complexité...