javascript 无论分辨率如何，如何将 div 对齐到屏幕的右上角？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8939494/
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
How to align div to top right corner of screen regardless of resolution?
提问by Donny
This is in regards to the following page: http://kinkarso.com/rayku/slider.html
这是关于以下页面：http: //kinkarso.com/rayku/slider.html
I'm looking to position the box to the top right corner of the screen, but currently if the screen resolution is different, it doesn't stay to the very right. Any ideas?
我希望将框定位到屏幕的右上角，但目前如果屏幕分辨率不同，它不会停留在最右边。有任何想法吗？
Thanks!
谢谢！
回答by Robert Koritnik
No need for javascript, use CSS instead
不需要 javascript，而是使用 CSS
Set position to fixed and add additional properties:
将位置设置为固定并添加其他属性：
#tutors-popup {
/* fixed within viewport */
position: fixed;
/* set position */
top: 20px;
right: 30px;
/* must have dimension */
width: 100px;
height: 200px;
}
You will also realise you don't need the inner div...
你也会意识到你不需要内部 div ......
If you don't like fixed alignment from the right margin, you can set rightusing % dimension as well. This will then set it differently depending on screen width (or resolution you're referring to).
如果您不喜欢从右边距固定对齐，您也可以right使用 % 尺寸进行设置。这将根据屏幕宽度（或您所指的分辨率）进行不同的设置。
回答by Anonymous
You need to set a variable width for your container, otherwise you won't be able to achieve this I guess. So width:100%would do. Then set the actual popup to the top right corner with float:right
您需要为您的 设置可变宽度container，否则我猜您将无法实现这一点。所以width:100%会做。然后将实际弹出窗口设置为右上角float:right
Note: This is only one solution, there propably are more out there!
注意：这只是一种解决方案，可能还有更多解决方案！
回答by Rafael Marques
Change the CSS from your Div Container to this
将 Div Container 中的 CSS 更改为此
#tutors-popup {
position: fixed;
top: 0;
right: 0;
}
The div 'tutors-popup' is now in the top right corner even if you change the Resolution.
即使您更改分辨率，div 'tutors-popup' 现在也位于右上角。
