css - 防止绝对正确定位的 DIV 在窗口调整大小时重叠内容

标签 css html positioning

我希望你能帮我解决这个问题。我在谷歌等上搜索了 1 小时,但没有任何效果 我有一个绝对 DIV,它位于浏览器的顶部右侧。

我如何防止,当浏览器水平调整大小时,它比例如。距页面水平中心 400 像素?

不能太难,但我已经没有头绪了。

最佳答案

2 种可能的解决方案:

  1. 尝试使用 float: right; 而不是绝对定位 div。
  2. 使用媒体查询随着浏览器大小的变化调整'right'的值,例如:
.rightDiv {
    right: 5px;
}
@media (min-width: 720px) { 
    .rightDiv {
        right: 50px;
}
@media (min-width: 960px) { 
    .rightDiv {
        right: 100px;
    }
}

关于css - 防止绝对正确定位的 DIV 在窗口调整大小时重叠内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12637037/

相关文章:

jquery - 在拖动 JQuery UI 时更改可排序元素的大小

css - 如何使 stylelint 防止嵌套 block 中最后一个大括号后出现空行?

html - 我的深层菜单无法正常工作

html - 在第二个 DIV 下方显示第一个 DIV

javascript - 如何用户输入对象属性和键

css - 根据内容或父元素拉伸(stretch)元素

css - 如何在页面顶部放置图像按钮

jQuery Mobile 导航栏包装在 4 个(而不是 5 个)元素上

javascript - 为 map 元素设置innerHTML

html - CSS 定位 - 如何将组件固定到位?