Disposition tabulaire: améliorer le design?

Question

Je suis en train de concevoir un formulaire: image et code ci-dessous. Il y a environ 30 autres sections comme celle-ci, et j'ai juste besoin des entrées (à droite) pour s'aligner sur la liste (au centre). Quelle est la meilleure façon de faire cela? Puis-je simplement modifier ma table HTML pour le faire fonctionner?

Layout http://img85.imageshack.us/img85/2199/screenshot20091227at719.png

  <table border="1"> 

       <thead> 
        <tr> 
         <th>Category</th> 
         <th>Risk Factors</th> 
         <th>Hours per Day</th> 
        </tr> 
       </thead>     
       <tbody> 
        <tr> 
         <td> 
          <strong>Repetition</strong> 
          <p>Finger, Wrist, Elbow, Shoulder or Neck Motions</p> 
         </td> 
         <td> 
          <ol> 
           <li><strong>Identical or Similar Motions Performed Every Few Seconds</strong><br />Motions or motion patterns that are repeated every 15 seconds or les. (Keyboard us is scored below as a separate risk factor.)</li> 
           <li><strong>Insensitive Keying</strong><br />Scored Separately from other repetitive tasks in the repetition category and includes steady pace as in data entry.</li> 
           <li><strong>Intermittent Keying</strong><br />Scored Separately from other repetitive tasks. Keyboard or other input activity is regularly alternated with other activities for 50 to 75 percent of the work.</li> 
          </ol> 
         </td> 
         <td> 
          <input autocomplete="off" size="2" type="text" name="a_1" id="a_1" class="text-input" value="<?php print $this->validation->a_1?>"/> 
          <input autocomplete="off" size="2" type="text" name="a_2" id="a_2" class="text-input" value="<?php print $this->validation->a_2?>"/> 
          <input autocomplete="off" size="2" type="text" name="a_3" id="a_3" class="text-input" value="<?php print $this->validation->a_3?>"/> 
         </td> 
        </tr> 
       </tbody> 
      </table> 

Answer 1

Je pense que vous devrez utiliser des lignes distinctes dans le tableau pour chaque ligne. Pour la première colonne, vous pouvez utiliser "rowspan = 3" pour que cette colonne circule sur les trois lignes.

Answer 2

Vous pouvez briser ce en une table de 4x3, avec le côté gauche ayant seulement deux lignes, la seconde ayant une rowspan=3. Cela finirait probablement par ressembler à ce que vous vouliez. Pour obtenir vos séparateurs horizontaux, vous pouvez utiliser colgroup pour regrouper vos colonnes; Cela vous permet d'attacher des bordures. Du même coup, vous pouvez formater la ligne blanche comme THEAD et la partie grise comme TBODY.