最初は簡単な問題に遭遇しますが、解決できません。多くの行 (簡略化するためにサンプルでは 1 つ) を持つフォームを表すテーブルがあり、2 つの列があります。最初の列にはラベルが含まれ、2 番目には入力フィールドが含まれます。
<table>
<tr>
<td class="labelcell">
<div class="label">
<label>Name</label>
</div>
</td>
<td>
<div class="control">
<div class="input">
<input type="text" value="John" />
</div>
<div class="more">+</div>
</div>
</td>
</tr>
</table>
私の問題は、ラベルのテキストと入力のテキストが垂直方向に整列していないことです。私の問題を再現する例を次に示します: http://jsfiddle.net/KBz8g/
ラベルが低すぎます。これを適切に解決する方法がわかりません。最初の 2 つの CSS ルール (meyer とボックスのサイズ設定からのリセット) を変更したくありませんが、プロパティの vertical-align をベースラインに設定することは疑わしいようです。