单选按钮对齐样式属性
问题描述:
即时通讯工作与表单,并推出了一些单选按钮,随后在表中的一些textareas ....问题是单选按钮出现在textarea的底部....我想这些位置向textarea的顶部单选按钮对齐样式属性
<table align='center' valign='top' border='1'><tr><th align='center' > qno)1</th></tr><tr><td><textarea rows='5' cols='50' readonly>question</textarea></td></tr>
<tr valign='top'><td><input type='radio' name='opt' value='A' checked='checked' /><textarea rows='1' cols='70' wrap='off' readonly>option d</textarea></td></tr>
<tr><td><input type='radio' name='opt' value='B' /><textarea rows='1' cols='70' wrap='off' readonly>option a</textarea></td></tr>
<tr><td><input type='radio' name='opt' value='C' /><textarea rows='1' cols='70' wrap='off' readonly>option b</textarea></td></tr>
<tr><td><input type='radio' name='opt' value='D' /><textarea rows='1' cols='70' wrap='off' readonly>option c</textarea></td></tr></table>
............请帮助
答
使用CSS的float:留在单选按钮:
style="float:left;"
为在
<style>
input [type="radio"],.NiceRadio {float:left;}
</style>
<table align='center' valign='top' border='1'>
<tr>
<th align='center' > qno)1</th>
</tr>
<tr>
<td><textarea rows='5' cols='50' readonly>question</textarea></td>
</tr>
<tr valign='top'>
<td><input type='radio' class="niceRadio" name='opt' value='A' checked='checked' /><textarea rows='1' cols='70' wrap='off' readonly>option d</textarea></td>
</tr>
<tr>
<td><input type='radio' class="niceRadio" name='opt' value='B' /><textarea rows='1' cols='70' wrap='off' readonly>option a</textarea></td>
</tr>
<tr>
<td><input type='radio' class="niceRadio" name='opt' value='C' /><textarea rows='1' cols='70' wrap='off' readonly>option b</textarea></td>
</tr>
<tr>
<td><input type='radio' class="niceRadio" name='opt' value='D' /><textarea rows='1' cols='70' wrap='off' readonly>option c</textarea></td>
</tr>
</table>
顶部的CSS仅供参考。它将float:left分配给所有单选按钮。输入[type = radio]是一个CSS选择器,可以在Mozilla等中使用。
答
HTML和CSS中的垂直对齐被完全搞砸了。这里描述的一些问题:Understanding vertical-align。
我心目中唯一的解决办法是这样的:把在这样的表的单选按钮和文本区域:
<table align='center' valign='top' border='1'>
<tr>
...
</tr>
<tr>
<td>
<table>
<tr>
<td style="vertical-align: top;">
<input type='radio' name='opt' value='B' /></td>
<td>
<textarea rows='1' cols='70'>option a</textarea></td>
</tr>
</table>
</td>
</tr>
<tr>
...
</tr>
</table>
感谢兄弟非常感谢............. ......顺便说一句,你为了生活做什么? – PROFESSOR 2009-07-28 09:14:14