html - チェック ボックスをラベルの下に揃えますか?

Question

チェックボックス用の次の HTML コードがあります。

<td class="myClass">
    select<br><input type="checkbox" id="one" name="delete" value="one">
</td>

その出力は次のとおりです。

しかし、次のように、チェックボックスをラベルのすぐ下に表示したい:

     select
       []

どうやってやるの？

Answer 1

text-align:center;スタイルをdisplay:block;コンテナに追加するだけです。

ヒント: (ご存じかもしれませんが) ラベルとチェックボックスのコンテナーが の<label>場合、入力はクリック イベントをコンテナーと共有します。例:

<table>
  <tr>
    <td class="myClass">
      <label>
        Click me, to change Checkbox value !<br>
        <input type="checkbox" id="one" name="delete" value="one" align="">
      </label>
    </td>
  </tr>
</table>

それをチェックしてくださいhttp://jsfiddle.net/G7JxA/

Answer 2

デモ

上記をご確認くださいdemo.

.myClass与えるtext-align:center;

<table>
    <tr>
<td class="myClass">
    select<br><input type="checkbox" id="one" name="delete" value="one" align="">
</td>
    </tr>
</table>