Fatal编程技术网
  • jquery/
  • Jquery 浮动div到右侧，在任意屏幕大小下留有右边空白

Jquery 浮动div到右侧，在任意屏幕大小下留有右边空白

jquery html css

Jquery 浮动div到右侧，在任意屏幕大小下留有右边空白,jquery,html,css,Jquery,Html,Css,我有背景图像（图像大小为2600x1170） 我在这张图片上有一个特殊的区域（在图片的右侧），我需要显示这个区域上的特殊div，我使用了float right和margin .main_box { float: right; margin-right: 505px; margin-top: 75px; } 屏幕分辨率1900x1200看起来不错，但如果我更改浏览器大小，我的边距div就坏了。 我如何能有相同的div位置，直到浏览器窗口超过800px <body c

我有背景图像（图像大小为2600x1170）

我在这张图片上有一个特殊的区域（在图片的右侧），我需要显示这个区域上的特殊div，我使用了float right和margin

.main_box {
    float: right;
    margin-right: 505px;
    margin-top: 75px;
}
屏幕分辨率1900x1200看起来不错，但如果我更改浏览器大小，我的边距div就坏了。 我如何能有相同的div位置，直到浏览器窗口超过800px

<body class="sbBody">
    <div class="main_box">
    </div>
</body>
谢谢。

当您将
div浮动到右侧时，您需要使用以下方法将背景固定到顶部和右侧：


background-position:top right;


而不是顶部中间的

请参见此

CSS:


旁注：CSS中的输入错误，sbBody在CSS媒体查询中遗漏了类dot.google，可能主框需要一个宽度。这一点很好，但效果是一样的。我认为图像大小有问题。但我不能改变it@a3code你能帮我处理一下你的问题吗？这样我可以看看我能做些什么。你可以不设置背景，而是设置一个图像，然后使用媒体查询来调整和重新定位该图像的大小。然后使用z-index来定位图层，虽然这是非正统的，但不推荐使用。您还可以使用JavaScript并运行返回所需位置的函数

background-position:top right;



.sbBody {
    background: #999 url(http://lorempixel.com/output/nature-q-g-1280-720-10.jpg) right top no-repeat;
    overflow-y: scroll;
    overflow-x: hidden;
    height: 1105px;
    font-family: Serif, Georgia, Times New Roman, Times;
    font-size: 12px;
}
.main_box {
    float: right;
    margin-right: 505px;
    margin-top: 75px;
    background:gold;

}