Показать несколько флажков в столбцах - PullRequest
Новая
       43

Показать несколько флажков в столбцах

0 голосов
/ 10 марта 2012

Мне интересно, какой лучший способ сделать следующее: (Я не могу публиковать фотографии, так как я новичок, поэтому вот ссылка на скринкаст) Несколько флажков Html http://www.screencast.com/t/zcGnM3fkA

Мне нужно включить этов форме регистрации, и мне интересно, как это лучше всего кодировать.Я знаю, что могу использовать HTML-таблицу, но я не уверен, что это лучший подход, потому что я также задаю другие вопросы, такие как # 3 на рисунке, которые не требуют более одного столбца.

Если я выбрал HTMLвариант таблицы, будет ли наиболее подходящей следующая разметка? 

 <table width="70%" cellspacing="3" cellpadding="3">
      <tr><td>1.) QUESTION GOES HERE?</td></tr>
    <tr>
      <td>
        <label>Watches</label><br />
          <input type="checkbox" class="all" /> Something </br>
          <input type="checkbox" class="all" />Something </br>
          <input type="checkbox" class="all" />Something </br>
          <input type="checkbox" class="all" />Something </br>
          <input type="checkbox" class="all" />Something </br>
      </td>
      <td>
        <label>Jewerly</label><br />
  <input type="checkbox" name="utType1[]" value="e" />Something </br>
  <input type="checkbox" name="utType1[]" value="e" />Something </br>
  <input type="checkbox" name="utType1[]" value="e" />Something </br>    
<input type="checkbox" name="utType1[]" value="e" />Something </br>
      </td>
      <td>
        <label>Jewerly</label><br />
  <input type="checkbox" name="utType1[]" value="e" />Something </br>
  <input type="checkbox" name="utType1[]" value="e" />Something </br>
  <input type="checkbox" name="utType1[]" value="e" />Something </br>    
<input type="checkbox" name="utType1[]" value="e" />Something </br>
      </td>
      </tr>
 <tr>
     <td>2.) QUESTION GOES HERE?</td>
      </tr>
  </table>

Демонстрация Fiddle здесь: http://jsfiddle.net/yAHyr/

или эта разметка будет более подходящей? 

<table>
<tbody>
 <!-- What should I use here to add a question with the instructions? -->
<tr>
<th>watches</th>
<th>jewerly</th>
<th>jewerly</th>
</tr>
<tr>
<td>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>    
<input type="checkbox" name="utType1[]" value="e" />Something </br> 
</td>
<td>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>    
<input type="checkbox" name="utType1[]" value="e" />Something </br> 
</td>
<td>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>    
<input type="checkbox" name="utType1[]" value="e" />Something </br> 
</td>
</tr>
<!-- What should I use here to add a question with the instructions? -->
<tr>
<th>watches</th>
<th>jewerly</th>
<th>jewerly</th>
</tr>
<tr>
<td>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>    
<input type="checkbox" name="utType1[]" value="e" />Something </br> 
</td>
<td>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>    
<input type="checkbox" name="utType1[]" value="e" />Something </br> 
</td>
<td>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>
<input type="checkbox" name="utType1[]" value="e" />Something </br>    
<input type="checkbox" name="utType1[]" value="e" />Something </br> 
</td>
</tr>
</tbody>
</table>

И, наконец, как я могу добавить вопрос с инструкциями?Если бы я поместил его в тд, он бы сдвинул вправо содержимое в других тд.

...