0

我只是花了一些时间试图弄清楚为什么某些表单内容在 IE8 和 IE9 中完全消失了。经过一番调查,看起来是将 fieldset 设置为 display:table-column 的错误。如果我将 fieldset 设置为 display:table 或 display:block,那么一切都会再次显示正常。

在我的 IE8 和 IE9 虚拟机上测试这个 html 时,我只能看到标题“不在字段集中”。如果我删除字段集样式,我可以看到两者。

有谁知道为什么会这样?

<html>
<head>

<style type="text/css">
fieldset
{
display: table-column; 
vertical-align: top
}
</style>
</head>

<body>
<form>
    <fieldset>
    <div class="row">
        <h6>Inside a fieldset</h6>
    </div>
    </fieldset>
<form>

<h6>Not inside a fieldset</h6>
</body>
</html>
4

2 回答 2

1

display: table-column意味着它的行为类似于<col>HTML 中的标签。标签是一个不可见的<col>元素,用于指定列的属性,如样式等。它与<td>(即display: table-cell)不同。

你应该table-cell改用。

W3C 规范

来源 - Random832 在这个 SO 线程中的回答

编辑: table-column仍然在 IE 7、FireFox 24、Chrome 和 Opera 15 中显示。它在 IE 8、9 和 10 中不起作用。

于 2013-10-20T16:40:46.497 回答
0

所有元素默认定位在垂直顶部。您无需编写任何额外的代码。我相信下面的代码就足够了:

<html>
<head>

<style type="text/css">
fieldset
{
height: 50px;  /*************** Not Required, Just to show what I mean by my sentence     mentioned above :) ****************/
}
h6,div {
margin: 0; padding:0;
}

</style>
</head>

<body>
<form>
<fieldset>
<div class="row">
    <h6>Inside a fieldset</h6>
</div>
</fieldset>
<form>

<h6>Not inside a fieldset</h6>
</body>
</html>
于 2013-10-20T17:02:07.487 回答