Centrer un tableau HTML

[Calinepowa]

Bien le bonjour !

Bien que je vais paraître bien ridicule car je suis certaine que la solution est simple   

Je vous expose mon soucis. Actuellement je refais une entête de forum, j'ai donc établit des tableaux.

Voici mon résultat:

Pour moi ce n'est pas un soucis de CSS mais peut-être que je me trompe.

Le code est utilisé est celui-ci:

J'ai essayé de caser des centers un peu partout... Sans résultat. ça marche très bien sans le cadre, mais avec rien ne fonctionne. J'ai cherché sur internet où j'ai trouvé ceci http://chatinais.pagesperso-orange.fr/courhtml/tableau/framalig.htm mais sans résultat concluant.

Merci d'avance

[Invité]

Bonjour, tu as essayé <center> </center> ?   

[Calinepowa]

J'ai essayé de caser des centers un peu partout... Sans résultat. ça marche très bien sans le cadre, mais avec rien ne fonctionne. J'ai cherché sur internet où j'ai trouvé ceci http://chatinais.pagesperso-orange.fr/courhtml/tableau/framalig.htm mais sans résultat concluant.

[Invité]

A la fin tu as mis ceci


Dans ton tableau tu as mis
TABLE {
float : left;
margin-left : 20px;
}

>< pour cela que tu as tout à gauche

Essaie ceci

Code:

<table style="padding:3px; border:5px ridge #e0e0e0; background-color:#212121;">
   
   <tbody>
      
      <tr>
         
         <td>
            <strong><a href="http://www.servimg.com/image_preview.php?i=187&u=16360685" target="_blank"><img src="http://i56.servimg.com/u/f56/16/36/06/85/sc11.jpg" alt="Image hébergée par servimg.com" border="0" /></a></strong>
         </td>
         
      </tr>
      
   </tbody>
   
</table><br /><br />
<table style="padding:3px; border:5px ridge #e0e0e0; background-color:#212121;">
   
</table>
<table style="padding:3px; border:5px ridge #e0e0e0; background-color:#212121;">
   
   <tbody>
      
      <tr>
         
         <td>
            <strong><span style="font-size: 18px; line-height: normal">État du Bois (Rôle Play) :</span></strong> <br /> <br /><span style="font-size: 14px; line-height: normal"> - On peut apercevoir un blocus d'ogres à Deuillevent à cause des sectateurs. <br />- Les sectateurs menacent toujours le Bois <br /> - Quelques worgens sauvages ont été aperçus sur la route principal proche de la Colline aux Corbeaux<br />- Nous rappelons que le Bosquet de Clairbois est libre d'accès <br /> </span> <br />
         </td>
         
      </tr>
      
   </tbody>
   
</table>
 
<table style="padding:3px; border:5px ridge #e0e0e0; background-color:#212121;">
   
   <tbody>
      
      <tr>
         
         <td>
            <strong><span style="font-size: 18px; line-height: normal"> Liens utiles (Hors Rôle Play) :</span></strong><br /><br /> Les articles de lois sont disponibles <a href="http://veilleurs.pro-forum.fr/t2-lois-en-vigueur-dans-les-bois-de-la-penombre?tid=d99f2c86368a7f47f6363cf796529969" class="postlink">ici</a><br /> Pour nous rejoindre c'est <a href="http://veilleurs.pro-forum.fr/t66-fiche-de-recrutement?tid=d99f2c86368a7f47f6363cf796529969" class="postlink"> ici </a><br /> Pour communiquer avec nous en HRP c'est <a href="http://veilleurs.pro-forum.fr/f20-hrp-public?tid=dd570bccf96fd2175685a08932105f63" class="postlink">ici</a><br /> Pour communiquer avec nous en RP c'est <a href="http://veilleurs.pro-forum.fr/f6-courrier-a-la-ville" class="postlink">ici</a><br /> <br />
         </td>
         
      </tr>
      
   </tbody>
   
</table>
 
<p>
   <br /><br /><br /><br /><br /><br /> <meta http-equiv="Content-Language" content="fr" /><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="Description" /><meta name="Keywords" />
</p><style type="text/css"><!--

TABLE {
float : center;
margin-left : px;
}
--></style>
<table style="padding:3px; border:5px ridge #e0e0e0; background-color:#212121;">
   
   <tbody>
      
      <tr>
         
         <td>
            <strong><strong><span style="font-size: 18px; line-height: normal">Statut de recrutement</span></strong></strong><br /><br /> <span style="color: rgb(51, 204, 0);"><span style="font-size: 22px; line-height: normal"><strong>OUVERT</strong></span></span><br /> <br />
         </td>
         
      </tr>
      
   </tbody>
   
</table>
 
<p>
   <meta http-equiv="Content-Language" content="fr" /><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="Description" /><meta name="Keywords" />
</p><style type="text/css"><!--

TABLE {
float : center;
margin-left : px;
}
--></style> <br /><br />

[Calinepowa]

J'ai déjà essayé de mettre center à la place de left.

[Invité]

J'ai édité le message

essaie le tableau que j'ai fais

[Calinepowa]

Rien à faire ça reste toujours collé à gauche

[Invité]

Flûte ça marche sur mon forum test  

regarde

http://redcenter.forumgratuit.org/

[Tech]

Bonjour,

Votre structure est tout à revoir... Je ne comprends pas pourquoi vous avez autant de table alors qu'une suffirait...
La structure suivante suffirait :

Code:

<table><tr>
<td>Ligne 1 / Colonne 1</td><td>Ligne 1 / Colonne 2</td>
</tr><tr>
<td>Ligne 2 / Colonne 1</td><td>Ligne 2 / Colonne 2</td>
</tr></table>

Mais sinon pour center le texte, il suffit de rajouter à votre table le style suivant text-align: center; ce qui donnera :

Code:

<table style="text-align: center;">...</table>

Et si c'est les cellules que vous voulez centrer et pas le texte, au lieu de mettre text-align: center; vous devez mettre margin: auto;

Cordialement.

[Calinepowa]

Simple côté esthétique Tech

Mais, à part incompréhension de ma part... Si j'ajoute le margin je perds mon padding toussa toussa et donc mon cadre. Excusez-moi je suis de niveau extrêmement débutant.

EDIT : Je suis phpBB3 si ça peut aider

[Scoubifitz]

bonjour,

ne serait-il pas plus simple de mettre le contenu dans 4 cellules , comme ceci ?

image
texte très long
texte	texte

remplacez tout le code par ceci :

Code:

<style type="text/css">
.accueil{
  border-spacing:3px;
  margin:auto;
}
.accueil td{
  padding:5px;
  border:5px ridge #e0e0e0;
  background-color:#212121;
  vertical-align:top;
}
.accueil p{
  font-size: 14px;
}
</style>
<table class="accueil">
<tbody>
<tr>
<td colspan="2"><img src="http://i56.servimg.com/u/f56/16/36/06/85/sc11.jpg" alt="Image hébergée par servimg.com" border="0" /></td>
</tr>
<tr>
<td colspan="2">
<h3>État du Bois (Rôle Play) :</h3>
<p> - On peut apercevoir un blocus d'ogres à Deuillevent à cause des sectateurs. <br />
- Les sectateurs menacent toujours le Bois <br />
- Quelques worgens sauvages ont été aperçus sur la route principal proche de la Colline aux Corbeaux<br />
- Nous rappelons que le Bosquet de Clairbois est libre d'accès </p>
</td>
</tr>
<tr>
<td>
<h3> Liens utiles (Hors Rôle Play) :</h3>
<p> Les articles de lois sont disponibles <a href="http://veilleurs.pro-forum.fr/t2-" class="postlink">ici</a><br />
Pour nous rejoindre c'est <a href="http://veilleurs.pro-forum.fr/t66-" class="postlink"> ici </a><br />
Pour communiquer avec nous en HRP c'est <a href="http://veilleurs.pro-forum.fr/f20-" class="postlink">ici</a><br />
Pour communiquer avec nous en RP c'est <a href="http://veilleurs.pro-forum.fr/f6-" class="postlink">ici</a>
</td>
<td>
<h3>Statut de recrutement</h3>
<h2 style="color: rgb(51, 204, 0)">OUVERT</h2>
</td>
</tr>
</tbody>
</table>


[Calinepowa]

J'ai remanipulé et le code de mistermind marche ! Pourquoi il n'a pas marché la première fois je ne sais pas... Merci beaucoup !

Ps : Plusieurs cellules c'est vraiment pour le côté esthétique, c'est pour ça que le tout collé ne m'intéressait pas