Réalisation d'un tableau

[toulouse1914]

Bonjour!
J'aimerais créer un tableau, comme ceci :

Cependant, je sais pas comment faire un tableau superposé ainsi. J'aimerais que les bords plus minces soient transparents, donc un tableau sans ''lignes'', sauf celle extérieure. Si c'est possible, j'aimerais bien que le tableau extérieur soit arrondi...

Merci!

[Narcismirk]

Bonjour !
Pour faire ce tableau, utilise ce code :

Code:

<table style="border:3px solid #000000; border-collapse:collapse;" border="0" width="300px">
   <tr>
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center" colspan="2">
Texte
      </td>
   </tr>
   
   <tr>
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
      
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
   </tr>
   
   <tr>
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
      
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
   </tr>
</table>

Dans ce code, je te l'ai laissé avec les bordures intérieures. Comme tu veux les enlever, tu dois supprimer dans les balises <td> le code border:1px solid #000000 ; ou bien tu remplaces le 1px par 0px.
Les cellules de ta première lignes sont fusionnées horizontalement. Pour faire cela, tu dois mettre colspan="nombredecellulesàfusionner" (ici 2) dans la balise <td> que tu désires modifier. Tu peux également le faire verticalement, grâce à rowspan="nombredecellulesàfusionner".

J'espère t'avoir aidé

Cordialement,
A bientôt.

[toulouse1914]

Comment on fait pour agrandir ce tableau? ^^

EDIT : J'ai trouvé! Mais comment on fait pour donner au tableau une couleur de fond et qu'il soit centré? Car quand je poste ce tableau, il y a un gros blanc au dessus...

[Narcismirk]

Tu as juste à changer le nombre de pixels dans les attributs width et height à ta convenance

[toulouse1914]

Oups, j'ai pas édité à temps... J'ai trouvé, mais il y a un gros blanc au dessus du tableau, et je n'arrive pas à le centrer. Comment on fait pour lui rajouter une couleur de fond? =)

[Narcismirk]

Pour le blanc au-dessus, je ne sais pas, ça ne me fait pas une telle chose :0

Pour le centrer, tu ajoutes align="center" dans la balise <table>

Pour la couleur de fond, tu ajoutes background-color:#COULEUR; à l'attribut style de la même balise.

[toulouse1914]

Pour le center c'est réglé, mais comment enlever le gros blanc au dessus?
http://alaska-dog-race.forumactif.com/t2-test-tableau-fiches#2

[Narcismirk]

AH ! J'ai compris pourquoi tu avais ce blanc, alors en fait, tu dois supprimer tous les sauts de lignes inutiles. Parce que comme c'est dans un message que tu as mis ton tableau, tu as le BBcode en plus. Et dedans, chaque saut de ligne compte.

[toulouse1914]

Code:

[center]<table style="border:3px solid #000000; border-collapse:collapse;" border="0" width="600px" align="center" background-color:#000000;>
  <tr>
      <td style="border:1px solid #000000; height:500px;" valign="top" align="center" colspan="2">
Texte
      </td>
  </tr>
 
  <tr>
      <td style="border:1px solid #000000; height:100px;" width=300px;" valign="top" align="center">
</span><span style="display: block; float: center; width: 250px; max-height: 200px; overflow: auto; padding: 4px;"><span style="display: block; text-align: center; font-family: arial black; letter-spacing: 2px; font-size: 25px; color: #e0e7eb; text-transform: uppercase;">Caractère</span>
texte texte texte texte </span>
</div>
      </td>
     
      <td style="border:1px solid #000000; height:300px;" valign="top" align="center">
Texte
      </td>
  </tr>
 
  <tr>
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
     
      <td style="border:1px solid #000000; height:100px;" valign="top" align="center">
Texte
      </td>
  </tr>
</table>[/center]

Voici mon code... Je n'ai aucun saut de ligne inutile, non? Et j'arrive pas à mettre la couleur (je suis tarée, je sais xD).

[Narcismirk]

Quand je veux dire les sauts de lignes inutiles, je voulais parler de ceux entre les balises. Fais plutôt comme ça :

Code:


[center]<table style="border:3px solid #000000; border-collapse:collapse; background-color:#000000;" border="0" width="600px" align="center"><tr><td style="border:1px solid #000000; height:500px;" valign="top" align="center" colspan="2">Texte
</td></tr><tr><td style="border:1px solid #000000; height:100px;" width=300px;" valign="top" align="center"></span><span style="display: block; float: center; width: 250px; max-height: 200px; overflow: auto; padding: 4px;"><span style="display: block; text-align: center; font-family: arial black; letter-spacing: 2px; font-size: 25px; color: #e0e7eb; text-transform: uppercase;">Caractère</span>texte texte texte texte </span></div></td> <td style="border:1px solid #000000; height:300px;" valign="top" align="center">Texte</td></tr><tr><td style="border:1px solid #000000; height:100px;" valign="top" align="center">Texte</td><td style="border:1px solid #000000; height:100px;" valign="top" align="center">Texte</td></tr></table>[/center]


Voilà. C'est compact, difficile à lire, mais c'est la seule manière que je connais pour enlever les espaces peu esthétiques =/

Pour la couleur de fond, si tu n'y es pas arrivé, c'est parce que tu n'avais pas correctement placé le code (pardonne moi, j'ai dû mal m'exprimer). Le background-color:#000000; doit absolument se trouver dans la balise style="", entre les guillemets. (Mais non, mais non, tu n'es pas folle )

[toulouse1914]

Merci beaucoup!

[Narcismirk]

Je t'en prie

[Invité]

Bonjour, Afin de faciliter la gestion des problèmes, si votre problème est résolu, pensez à : éditer votre premier message, cocher l'icône Et enregistrer en cliquant sur Vous pouvez également remercier les personnes qui vous ont aidé, en cliquant sur le bouton A bientôt sur ForumActif