Question

我有这个例子： Fiddle link

使用display的表：table，display：table-cell，display：table-row

我需要在＆lt; p＆gt;之前添加一个＆lt; span＆gt;标签，但我的表结构中断。

有什么想法吗？感谢

示例：

<fieldset>
<span>
<p>
    <label>First Name: </label>
    <input type="text" />
</p>
</span>
<span>
<p>
    <label>Second Name: </label>
    <input type="text" />
</p>
</span>
<span>
<p>
    <label>Country: </label>
    <select>
        <option>Choose</option>
    </select>
</p>
</span>
<span>
<p>
    <label>Age: </label>
    <select>
        <option>Choose</option>
    </select>
</p>
</span>
</fieldset>

Answer 1

如果要显示为表格，则所有元素都应遵循相同的结构属性

fieldset span {
    display: table-row-group;
}

小提琴：http://jsfiddle.net/qQ3xJ/

Answer 2

您要table-row包裹<p>个元素（本例中为<span>个标签）。您可以将<span>元素的显示类型更改为table-row-group：

fieldset span {
    display: table-row-group;
}

以下是 JSFiddle Demo

Answer 3

我会使用不同的结构：http://jsfiddle.net/7Kxf5/，div或ul列表。

我认为在这种情况下使用span不符合良好做法。

CSS display-table + SPAN错误

3 个答案: