我可以定位相对于父元素固定的元素吗? [英] Can I position an element fixed relative to parent?

问题描述

我发现当我定位一个固定的元素时，父元素是否相对定位并不重要，它会相对于窗口定位?

#wrapper {宽度:300px；背景:橙色；边距:0 自动；位置:相对；}#回馈 {位置:固定；右:0；顶部:120px；}

...<a id="feedback" href="#">反馈</a>

http://jsbin.com/ibesa3

解决方案

让我为这两个可能的问题提供答案.请注意，您现有的标题(和原始帖子)提出的问题与您在编辑和后续评论中寻求的不同.

<小时>

要相对于父元素固定"定位元素，您需要在子元素上position:absolute，以及除默认或静态之外的任何位置模式在您的父元素上.

例如:

#parentDiv { position:relative;}#childDiv { 位置:绝对；左:50px；顶部:20px；}

这将使 childDiv 元素相对于 parentDiv 的位置向左 50 像素，向下 20 像素.

<小时>

要将元素相对于窗口固定"定位，您需要position:fixed，并且可以使用top:, left:、right: 和 bottom: 到您认为合适的位置.

例如:

#yourDiv { position:fixed;底部:40px；右:40px；}

这将使 yourDiv 相对于 Web 浏览器窗口固定，距底部边缘 40 像素，距右边缘 40 像素.

I find that when I position an element fixed, it doesn't matter if the parent is positioned relative or not, it will position fixed, relative to the window?

#wrapper {
  width: 300px;
  background: orange;
  margin: 0 auto;
  position: relative;
}

#feedback {
  position: fixed;
  right: 0;
  top: 120px;
}

<div id="wrapper">
    ...
    <a id="feedback" href="#">Feedback</a>
</div>

http://jsbin.com/ibesa3

解决方案

Let me provide answers to both possible questions. Note that your existing title (and original post) ask a question different than what you seek in your edit and subsequent comment.

---

To position an element "fixed" relative to a parent element, you want position:absolute on the child element, and any position mode other than the default or static on your parent element.

For example:

#parentDiv { position:relative; }
#childDiv { position:absolute; left:50px; top:20px; }

This will position childDiv element 50 pixels left and 20 pixels down relative to parentDiv's position.

---

To position an element "fixed" relative to the window, you want position:fixed, and can use top:, left:, right:, and bottom: to position as you see fit.

For example:

#yourDiv { position:fixed; bottom:40px; right:40px; }

This will position yourDiv fixed relative to the web browser window, 40 pixels from the bottom edge and 40 pixels from the right edge.

这篇关于我可以定位相对于父元素固定的元素吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！