在我的网站上，我需要使用css属性overflow：overlay用于< div&gt ;. 但是，在浏览器中并没有渲染，而是在firebug中检查css，甚至没有显示出来，而是在Chrome中运行。我没有测试出野生动物园。 我必须改变什么来获得溢出：overlay css属性工作？ 谢谢

溢出的可能值为：

visible
hidden
auto
scroll

参见here或here讨论这些。

在不同浏览器中使用任何其他值将会产生不可预测的结果，因为它们处理不正确的值不同。

编辑：在发表评论后，我已经设法提到了overflow：overlay here。

覆盖描述为：

Content is clipped and scroll bars are added when necessary.

重要的是，它还表示只能在Safari或Chrome(即WebKit)中工作。

This item在WebKit bugzilla上建议在任何情况下这个世界都不长久：

WebKit currently has a proprietary CSS overflow value called “overlay” which is undocumented and as far as I can tell from reading the code works exactly like “auto”.

We should either remove it or rename it to “-webkit-overlay”.

更新2016年3月

看起来像溢出：覆盖没有消失。有迹象表明它正在进入标准。

覆盖和自动之间的区别只是滚动条会显示在页面内容的顶部，而不会导致它占用布局空间。

见here for the discussion。

通常,我们可以将父元素设置为子元素绝对定位的上下文,如下所示：

#parent {
    position: relative;
}

#child {
    position: absolute;
    top: 0;
    left: 0;
}

这一切都很好,但是当父级的display属性设置为table-cell时,它在Firefox中不起作用.子元素的定位上下文将是其父元素上方最接近的定位祖先.

值得注意的是,这适用于其他地方.在IE8,IE9,Safari,Chrome&歌剧.

请看这里的小提琴：http://jsfiddle.net/RZ5Vx/

另请参阅this fiddle with the parent’s display set to inline-block,它在Firefox中可以使用.

那么,这是一个错误吗？如果是这样,无论如何还有解决方法吗？

表格单元格意味着在表格内部,因此：

见working Fiddle!

div {
    display: table;      /* this line */
    line-height: 28px;
    padding: 0 20px;
    background: #ddd;
    position: relative;
}

注意：
由于您没有表格,请设置它.

您可以在显示声明中看到此quirksmode.

EDITED

它从W3C recommendation :: Tables开始

The computed values of properties ‘position’,‘float’,‘margin-*’,‘top’,‘right’,‘bottom’,and ‘left’ on the table element are used on the table wrapper Box and not the table Box; all other values of non-inheritable properties are used on the table Box and not the table wrapper Box. (Where the table element’s values are not used on the table and table wrapper Boxes,the initial values are used instead.)

这不是一个错误,更像是一个状态设计的东西！请参阅this！

EDITED

要根据问题的要求包含对评论的处理：

So, is this a bug? If so, is there anyway to work around it?

可能的解决方法是：

用div作为位置包裹元素：relative; See Fiddle!

#wrapper {
    position: relative;
}

注意：最实用的解决方案！

用div作为位置包裹内部元素：relative; See Fiddle!

#innerWrapper {
    position: relative;
}

注意：需要在innerWrapper上声明原始元素的一些定义！

我试图将< select>在firefox.在镀铬我做了：

-webkit-appearance: none;
background: #eeeeee url("../img/select-arrow.jpg") no-repeat center right;

但是在firefox上,我似乎无法获得相同的结果

-moz-appearance: none;
background: #eeeeee url("../img/select-arrow.jpg") no-repeat center right;

有任何想法吗？谢谢.

由于Firefox 35,您已经在代码中编写的“-moz-appearance：none”,最终根据需要删除箭头按钮.

这是自那个版本以来解决的一个bug.

在firefox中,当我使用引导表单控件输入元素时,如果我填写输入元素,它会通过向内填充而不是文本周围的方式来剪切文本.在firefox中似乎只有这样的效果.这个jsfiddle演示了这个问题：

http://jsfiddle.net/v76xB/

表单输入html：

<input id="name" type="text"placeholder="Enter a Username">

CSS：

.join-form {
    padding: 24px; /*comment this out to see effect of padding */
    margin: 12px 0px;
    font-size: 16px;
    letter-spacing: 0px;
    font-weight: 300;
}

这是关于具体的,我可以得到复制这个错误.我也一半希望这只是一个完全与我相关的浏览器怪癖,但是我不能单独检查,只有一台机器.

Bootstrap表单控件类默认为一个固定的高度.只需添加一个height：auto;到您的.join-form选择器(以保持灵活性),并更改填充以获得原始效果,如此填充：14px 20px;

见：http://jsfiddle.net/x78Bh/