Probleme pour centrer un tableau

flexi2202 Messages postés 3640 Date d'inscription   Statut Membre Dernière intervention   -  
 flexi2202 -
bonjour a tous
j essaye de me construire une page web qui serais compatible avec tous les appareils
mais j ai deja un soucis avec mon logo et le centrage du tableau
si quelqu un peux m aider merci
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Titre</title>
</head>

<body>

<div style="width:80%; text-align:center;">
<TABLE CELLPADDING="2" CELLSPACING="2" WIDTH="80%"border="1">

<caption>Passagers du vol 377</caption>

<thead> <!-- En-tête du tableau -->
<tr>
<th colspan="6"><img src="https://www.000webhost.com/migrate?static=true" alt="" /></th>

</tr>
</thead>

<tfoot> <!-- Pied de tableau -->
<tr>
<th >Nom</th>
<th>Âge</th>
<td>mes debuts</td>
<td>astuces</td>
<td>Mon blog</td>
<td>contact</td>
</tr>
</tfoot>

<tbody> <!-- Corps du tableau -->
<tr>
<td WIDTH="25%">Carmen</td>
<td WIDTH="15%">acceuil</td>
<td WIDTH="15%">mes debuts</td>
<td WIDTH="15%">astuces</td>
<td WIDTH="15%">Mon blog</td>
<td WIDTH="15%">contact</td>
</tr>
<tr>
<td>Carmen</td>
<td colspan="5" rowspan="4">acceuil</td>

</tr>
<tr>
<td>Carmen</td>

</tr>
<tr>
<td>Carmen</td>

</tr>
<tr>
<td>Carmen</td>

</tr>

</tbody>
</table>

</body>
</html>

7 réponses

  1. dugenou Messages postés 6262 Statut Contributeur 1 455
     
    Bonjour,

    Il faut utiliser du CSS :

    .tableau
    {
    margin-left:auto;
    margin-right:auto;
    width:80%;
    }


    Et placer la class dans le code HTML :

    <table cellspacing="2" cellpadding="2" border="1"  class="tableau">
    0
  2. flexi2202 Messages postés 3640 Date d'inscription   Statut Membre Dernière intervention   190
     
    merci super cela fonctionne
    un tout grand merci
    a présent je souhaiterais que mon logo s adapte a la taille de sa cellule
    merci de l aide
    0
  3. dugenou Messages postés 6262 Statut Contributeur 1 455
     
    Il faudrait déjà commencer par la réduire, car 992px × 185px et 186,06 Ko c'est beaucoup pour un logo.

    Ensuite, il faut mettre des attributs width=" " et height=" ", soit aux dimensions de l'image, soit aux dimensions de la cellule.

    Ce que je ferais, ce serait de mettre en pourcentage width="100% " height=" ". A tester, si ça convient.
    0
  4. flexi2202
     
    merci pour l aide
    comment je pourrais faire pour réduire le poids de l image
    0
    1. dugenou Messages postés 6262 Statut Contributeur 1 455
       
      Réduis les dimensions de l'image, tu ne vas probablement pas l'afficher en 992px × 185px.

      Je n'avais pas regardé tout ton code, je crois comprendre que tu veux faire ton site en utilisant des tableaux pour sa mise en forme, si c'est bien ça, revois ton projet, on ne crée plus les sites de cette manière depuis longtemps.
      0
  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. flexi2202
     
    merci pour l aide
    oui c est ca je veux faire avec des tableaux en html , comment je dois faire alors
    un petit exemple svp merci
    0
  7. flexi2202
     
    je pourrais faire comme ceci alors
    CSS
    .Tableau span {
    display:inline;
    float:left;
    border:1px solid #FF6600;
    margin:0px;
    padding:3px;
    }
    .Tableau p {
    clear:left;
    margin:0px;
    padding:0px;
    height:100% !important; height:1em;
    }
    .Tableau p.legende {font-weight:bold}
    .Tableau span.col1 {width:70px}
    .Tableau span.col2 {width:120px}
    .Tableau span.col3 {width:90px}

    HTML
    <div class="Tableau">
    <p class="legende">
    <span class="col1">Légende 1</span>
    <span class="col2">Légende 2</span>
    <span class="col3">Légende 3</span>
    </p>
    <p>
    <span class="col1">Case 1.1</span>
    <span class="col2">Case 1.2</span>
    <span class="col3">Case 1.3</span>
    </p>
    <p>
    <span class="col1">Case 2.1</span>
    <span class="col2">Case 2.2</span>
    <span class="col3">Case 2.3</span>
    </p>
    </div>
    0
    1. dugenou Messages postés 6262 Statut Contributeur 1 455
       
      Le mieux est d'apprendre à utiliser le CSS avec le HTML.

      Sur www.alsacreations.com il y a de nombreux tutoriels, par exemple : "Réalisation d'un design complet (HTML / CSS) en 4 étapes"
      0
  8. flexi2202
     
    merci pur l aide
    je vais aller voir
    0