Html CSS位置：绝对屏幕分辨率问题
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3298720/
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
CSS position: absolute screen resolution problem
提问by dave
CSS code:
CSS代码：
top:45;
left:98;
float:right;
position:absolute;z-index:2;
I have done the above coding for a floating divwhen I was working on 1024 resolution, but when I tested the same on a different resolution it's out of alignment.
div当我在 1024 分辨率下工作时，我已经为浮动完成了上面的编码，但是当我在不同的分辨率上测试相同时，它没有对齐。
How can we fix it?
我们该如何解决？
回答by Pat
Absolutely positioned elements are positioned according to either a relatively positioned ancestor or the window. It sounds like in your case, it's being positioned in the window.
绝对定位的元素根据相对定位的祖先或窗口进行定位。在你的情况下，它听起来像是被定位在窗口中。
The way to fix this is to put your absolutely positioned <div>inside a relative container. That way, as the window changes size, it will stay in the correct spot:
解决这个问题的方法是将您的绝对定位<div>放在一个相对容器中。这样，随着窗口大小的变化，它将停留在正确的位置：
<div style="position: relative">
<div style="position: absolute; left: 98px; top: 45px;">
This div will always be 98px from the left and 45px from the top of its parent .
</div>
</div>
回答by Aamir Shahzad
None of the above solutions work for me... keep it on absolute positionand give margin-top, margin-left...in %agelike;
以上解决方案都不适用于我......保持绝对位置并给出margin-top, margin-left...in %agelike;
margin-top:10%;
margin-left:5%;
that will automaticallyadjust w.r.t. screen resolution...
这将自动调整wrt屏幕分辨率...
this worked perfect for me. tested on different resolutions.
这对我来说很完美。在不同的分辨率下测试。
have a fun!
玩得开心！
回答by TinTin
Instead of pixel, use the %. It may help you to produce the output.
而不是像素，使用%. 它可以帮助您生成输出。
回答by Jayphen
Assuming the element is not contained within another element with a position of relative, the element you are positioning should be in the same position regardless of resolution.
假设该元素不包含在具有相对位置的另一个元素中，则无论分辨率如何，您定位的元素都应位于同一位置。
Make sure you use:
确保您使用：
top: 45px
left: 98px
You left the pixel declaration off in your code above.
您在上面的代码中保留了像素声明。
Also, float:right is not required on the positioned element, as position:absolute will take it out of the normal flow of the document anyway.
此外，定位元素不需要 float:right，因为 position:absolute 无论如何都会将其从文档的正常流中移除。
