Question

这是我的HTML - 点击下面的链接

我无法编辑此html。我只能通过CSS编辑。

我想把表单中的每个单独的框放在不同的行中。我无法创建任何CSS代码。我被卡住了。

Answer 1

由于您没有<table>标记，浏览器通常会忽略<tr>，<td>和<th>标记，只输出内部内容。理想情况下，您只需更改html，但如果您必须在css中执行此操作，则可以通过将输入/标签显示为块元素然后适当地浮动它们来使它们排成一行：

#commentForm label, #commentForm input, #commentForm textarea { display: block; }
#commentForm label { float: left; clear: left; }
#commentForm input, #commentForm textarea { float: left; clear: right; }
#commentForm p { clear: both; }

参见jsfiddle：http://jsfiddle.net/kY38D/2/

Answer 2

正如DRP96所说，既然你没有表格标签，你就没有多少选择..这是使用宽度的一种方式：

<style>
    label {
        display: inline-block;
        width: 25%;
    }

    input[type='text'], textarea {
        display: inline-block;
        width: 75%;
        margin-bottom: 1em;
    }
</style>

Answer 3

编辑：然后尝试display:block获取tr。通常它应该在不同的行中。

（您没有任何table标签）

如何在单独的行中显示表

3 个答案: