将 div 固定在 html 中的某一点答案

【问题标题】：Make div fixed at one point in html将 div 固定在 html 中的某一点
【发布时间】：2012-02-02 22:07:10
【问题描述】：

我有一个包含两个按钮的 div，我希望该 div 固定在一个地方，如果我调整浏览器的大小，它不应该改变它的位置。

我尝试使用 position:fixed 但不起作用，并且当调整大小时位置正在改变。

这是我的 CSS：

html {
    height: 100%;
}
    body
{
    margin: 0;
    padding: 0;
    width: 100%;
    background-image: url('../images/bgPat3.png');
    background-repeat: repeat;
}
.Imagebuttons
{
    position:absolute;
    top:494px;
    right:337px;
}

这是我的 DIV 容器：

<div class="Imagebuttons">
             <asp:ImageButton ID="ImageButton3" runat="server" ImageUrl="~/images/Image1.png" />
                &nbsp;&nbsp;&nbsp;
              <asp:ImageButton ID="ImageButton4" runat="server" 
                    ImageUrl="~/images/Image2.png" /><br />
</div>

这就是它现在的样子：

调整大小之前：

调整大小后：

【问题讨论】：

标签： asp.net html css

【解决方案1】：

使用 css left 而不是 right，这样它将保持在同一个位置。

通过使用right，您可以从浏览器的窗口/元素容器的右侧指定填充。通过重新调整窗口大小，您可以更改右侧的位置，但填充仍然相同。这是demo

【讨论】：

再次感谢演示。

【解决方案2】：

它不应该改变它的位置，因为你使用的是position:absolute。
但是，您可能希望将 width 和 height 添加到 div.Imagebuttons 以防止其大小在调整窗口大小时发生变化。

.Imagebuttons{
    position:absolute;
    top:494px;
    right:337px;
    width:200px;
    height:100px;
}

【讨论】：

@Derek-感谢您的回复，我已更改它，但它显示相同。

【解决方案3】：

如果您的 div 位于另一个具有 position:relative 的 div 中，则可能会发生这种情况。

将你的绝对 div 放在 body 标记内进行测试。

【讨论】：

@rogelware-感谢您的回复，我里面没有任何其他 div。我已经尝试搜索了很多问题，但它不适合我的问题。