Tableau HTML mise en page

Question

Je suis en train de tables de configuration afin que les résultats de résultat comme celui-ci:

code:

<table width="60%" cellpadding="0" cellspacing="1" id="theBoxer"> 
<tr style="background: #686868 ;"> 
<td align="center" valign="top" width="240" height="25" style="border:1px #FFF solid;">About me</td> 
</tr> 
<tr> 
<td align="left" valign="top" width="250" height="112" style=""> 
Points:<br> 
Lalala: <br> 
Lalala: <br> 
</td> 
<td align="left" valign="top" width="250" height="112" style=""> 
Lalala: <br> 
Lalala: 
</tr> 
</table> 

ne peut pas faire fonctionner comme la façon dont je voulais.
Le problème que j'obtiens avec mon code est que "About me" ne couvre que la première cellule et pas l'autre.

Answer 1

Vous avez besoin de colspan="2" dans la <td> de la première ligne pour qu'elle couvre deux colonnes.

Semantically, vous souhaitez également utiliser <th> (en-tête de la table) au lieu de <td>.

Voir aussi:

• HTML table tutorial

Answer 2

Cela devrait faire l'affaire:

<table width="60%" cellpadding="0" cellspacing="1" id="theBoxer"> 
    <tr style="background: #686868 ;"> 
     <td align="center" valign="top" colspan="2" width="240" height="25" style="border:1px #FFF solid;" > 
      About me 
     </td> 
    </tr> 
    <tr> 
     <td align="left" valign="top" width="250" height="112" style=""> 
     Points:<br> 
      Lalala: <br> 
      Lalala: <br> 
     </td> 
     <td align="left" valign="top" width="250" height="112" style=""> 
      Lalala: <br> 
      Lalala: 
     </td> 
    </tr> 
</table> 

Notez l'attribut colspan sur la première balise <td> - ce qui garantira que couvre la largeur de deux colonnes.

De plus, vous pourriez également élargir votre table pour contenir les éléments thead et tbody, fournissant une séparation entre les différentes sections de contenu:

<table width="60%" cellpadding="0" cellspacing="1" id="theBoxer"> 
    <thead> 
     <tr style="background: #686868 ;"> 
      <th align="center" valign="top" colspan="2" width="240" height="25" style="border:1px #FFF solid;" > 
       About me 
      </th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td align="left" valign="top" width="250" height="112" style=""> 
       Points:<br> 
       Lalala: <br> 
       Lalala: <br> 
      </td> 
      <td align="left" valign="top" width="250" height="112" style=""> 
       Lalala: <br> 
       Lalala: 
      </td> 
     </tr> 
    </tbody> 
</table>