2

我有一个看起来像这样的字段集:

<fieldset>
    <input><label>tada</label>
    <input><label>tada</label>
</fieldset>

fieldset{
    overflow: hidden;
    height: 20px;
}

input{
    display: block   
}

Js小提琴:

http://jsfiddle.net/GWdWy/1/

字段集如何显示它包含的所有元素,而如果我将字段集更改为 div:http: //jsfiddle.net/GWdWy/2/

溢出隐藏的作品。

4

3 回答 3

4

我想你一定是在 Firefox 上,如果是这样的话,那就是一个错误

错误 261037 - 未在字段集上实现溢出属性


解决方法:我在div里面嵌套了一个fieldset

演示

fieldset div {
    overflow: hidden;
    height: 20px;
}
于 2013-09-26T10:42:19.537 回答
2

我遇到过同样的问题。Firefox 似乎不允许溢出:隐藏在字段集标记上,无论您使用溢出-y 还是溢出-x。我的解决方法是使用“-moz-hidden-unscrollable”。像这样...

fieldset{
    overflow: -moz-hidden-unscrollable;
}

这是一个肮脏的黑客,但它有效。

回复:https ://developer.mozilla.org/en-US/docs/Web/CSS/overflow#Values

于 2013-10-29T23:23:42.607 回答
-2

该字段集具有由默认浏览器 css 设置应用的填充。

使用 CSS 重置来确保默认值在所有浏览器和元素中均等化。

检查最常用的一个 - Eric Meyer 的重置: http: //meyerweb.com/eric/tools/css/reset/

在您的第一个小提琴集中,在 Fieldset 的 css 之后:

fieldset{
  overflow: hidden;
  height: 20px;
  padding: 0;
  margin: 0;
  border: none;
}

这将均衡显示。对于 Firefox,可以在此处找到解决方法: Firefox 中的字段集内容溢出

于 2013-09-26T10:44:30.190 回答