Bonsoir,

j'ai un petit problème avec mon tableau. Le voici (image coupée) : 

Voici mon code html : 

<table class="fondcouleur largeur100" style="border-radius: 10px;">
    <tr>
        <td class="pastd centre"><a class="passouligner" style="background-color: black;" href="videos/menu-video.php"><img class="imageArborescence" src="images/youtube.svg"><h2>Vidéos</h2></a></td>
        <td class="pastd centre"><a class="passouligner" style="background-color: black;" href="vco/vco.php"><img class="imageArborescence" src="images/blog.svg"><h2>Blog</h2></a></td>
        <td class="pastd centre"><a class="passouligner" style="background-color: black;" href="livre/livre.php"><img class="imageArborescence" src="images/livres.svg"><h2>Livres</h2></a></td>
    <tr>
</table>

Et le css : 

.centre 
{
  text-align: center;
}
table 
{
    border-collapse: collapse; /* Les bordures du tableau seront collées */
    text-align: justify;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 10px;
}
h2 {
  font-size: 15px; /*taille*/
  color: white;
  transition: all 0.5s ease;
  display:inline-block;
} 
.imageArborescence 
{
  border-radius: 0%;
  max-width: 50px;
  max-height: 50px;
  display:inline-block;
}

J'aimerais obtenir un alignement de ce type : 

Si j'ai oublié de mettre une classe css qui vous semblerait utile, n'hésitez pas à me le dire.

Merci par avance pour votre aide,

Thomas

Bonjour, <table>  n'est pas fait pour de la mise en page mais pour des données tabulaires.

Utilisez d'autre balise HTML pour réaliser cet affichage. Par exemple <figure>

La balise <img> ne sort jamais sans son attribut alt obligatoire.

-
Edité par AbcAbc6 13 octobre 2021 à 3:11:00