Question

我需要显示子块，它绝对位于父块中，具有固定位置和overflow: hidden属性：

这是fiddle。

HTML：

<div class="parent">
    <div class="child"></div>
</div>

CSS：

.parent {
    background-color: green;
    width: 200px;
    height: 100%;
    position: fixed;
    overflow: hidden;
}

.child {
    background-color: red;
    width: 50px;
    height: 50px;
    position: absolute;
    top: 50px;
    left: 175px;
}

如果父亲有position: static且身高固定，则可行。或者，如果孩子有position: fixed ...

Answer 1

您可以通过将.parent div包含在.grandparent div中并将position:fixed;属性转移到祖父母来进行设置，如下所示：{{3}}

<强> HTML：

<div class="grandparent">
  <div class="parent">
      <div class="child"></div>
  </div>
</div>

<强> CSS：

.grandparent{
    position:fixed;
}

.parent {
    background-color: green;
    width: 200px;
    height: 100px;
    overflow: hidden;
}

.child {
    background-color: red;
    width: 50px;
    height: 50px;
    position: absolute;
    top: 200px;
    left: 175px;
}

Answer 2

在父元素上尝试position：relative。

overflow：hidden + position：fixed parent - view position with position：absolute

2 个答案: