0

如何强制浏览器不根据某些绝对定位的元素计算内容的大小?我正在寻找类似https://developer.mozilla.org/en-US/docs/CSS/-moz-stack-sizing

对于一个简单的用例,请查看http://jsfiddle.net/edzis/5nnYk/

html, body, .container {
    /**
        https://developer.mozilla.org/en-US/docs/CSS/-moz-stack-sizing
        DOES NOT WORK
    **/
    -moz-stack-sizing: ignore;
    -webkit-stack-sizing: ignore;
    stack-sizing: ignore;
}
4

1 回答 1

0

这可能与您正在寻找的内容不完全匹配,但也许它可以提供一些想法。

如果您可以更改 html 代码,则可以通过使用第二个绝对定位层来使用“溢出:隐藏”,并让“容器”div 仅负责您想要滚动的尺寸。

注意:如果初始窗口宽度很小并且容器导致滚动,则可能存在问题,屏幕外的元素可能无法呈现并且需要刷新。

这是一个更新的 jsfiddle 链接:http: //jsfiddle.net/5nnYk/24/

代码例如:

<div class="panel">
    <div class='left'>LEFT</div>
    <div class='right'>RIGHT</div>
</div>
<div class='container'>
</div>

然后将面板类设置为:

.panel{
    width:99%;
    height:200px;
    position:absolute;
    z-index:1;
    overflow:hidden;
    -webkit-transform-style: preserve-3d;
}

顺便说一句:我将宽度设置为 99% 而不是 100%,因为它修复了另一个有时会上升并导致水平滚动的问题。解决这个问题的另一种方法是使用 left: 0px; 在面板上。

于 2013-04-26T05:30:00.970 回答