Question

在我的应用程序中，有一个视图页面，我正在显示一个问题及其答案。答案可能很长。每个答案前面都会有一个radio button。我的答案的观点可以在这里找到（http://jsfiddle.net/eN22Q/）

在这方面，我如何能够为答案内容实现以下给定的风格：

MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD   MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD   MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD   MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MSD MS

请帮助：）

Answer 1

一张简单的表适合你吗？

演示：http://jsfiddle.net/kG7rP/2/

<强> CSS

td{vertical-align:top;}

<强> HTML

<table>
    <tr>
        <td>
            <input type="checkbox" />
        </td>
        <td>
            long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text 
        </td>
    </tr>
    <tr>
        <td>
            <input type="checkbox" />
        </td>
        <td>
            long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text 
        </td>
    </tr>    

</table>

Answer 2

如果您不想在页面中添加额外标记，请使用css hacks，例如 - 输入单选按钮display: inline-block;并添加负边距，margin-left: -20px; 在你的情况下。

<input id="answer_id_195" name="answer_id" style="margin-left: -20px;
margin-right: 5px;
margin-top: 2px;
float: left;
display: inline-block;" type="radio" value="195">

假设元素保留在那里，即使它离开了它的位置。希望这对你有用。

在CSS中正确对齐div内容

2 个答案: