Html 位置相对属性和权利属性
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12919073/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
position relative and right property
提问by Chapsterj
I always thought by setting the div to relative and right 0 would position the div all the way to the right, if its parent was 100% width. Apparently I'm wrong and only absolute works like that. So is there no way to make it work with relative?
我一直认为通过将 div 设置为 relative 和 right 0 会将 div 一直定位到右侧,如果其父级为 100% 宽度。显然我错了,只有绝对的作品才会这样。那么有没有办法让它与亲戚一起工作?
回答by Willem Van Bockstal
You have to set the parent to be relative, and it's child to absolute positioning.
您必须将父项设置为相对,而将子项设置为绝对定位。
.parent{
position: relative;
width: 100%;
}
.right{
position: absolute;
width: 200px;
height: 200px;
background: red;
top:0;
right:0;
}
? Like here: http://jsfiddle.net/willemvb/n9Vrv/
回答by George
There's a way to make it work to a relative.
有一种方法可以让它对亲戚起作用。
One way is first to set the parent of the display to inline-flex
.
一种方法是首先将显示的父级设置为inline-flex
。
Next, set the element (child) position:relative; margin-left:auto; right:0;
.
接下来,设置元素 (child) position:relative; margin-left:auto; right:0;
。
回答by Quentin
So is there no way to make it work with relative?
那么有没有办法让它与亲戚一起工作?
Correct. Relative positioning is the position offset from where it would be with static positioning.
正确的。相对定位是相对于静态定位的位置偏移。
You need absolute positioning to position with respect to the edges of the containing block.
您需要绝对定位才能相对于包含块的边缘进行定位。