固定定位元素宽度跟随移动，如何解决？

发布日期： 2024-10-23 阅读量： 作者： 网络

固定定位元素宽度跟随移动，如何解决？

css 中的宽度计算问题

在设置元素宽度时，偶尔会遇到一些问题。本文将讨论一个特定的问题：当一个固定定位的底部按钮栏在侧边栏打开时会跟随移动并超出边框。

问题

有一个底部按钮栏，使用固定定位设置在页面的底部。当侧边栏打开时，按钮栏会跟随移动，从而超出了页面的边框。

解决方案

为了解决这个问题，需要对 html 结构进行一些修改，让按钮栏相对于其父元素而不是页面本身进行定位。以下是修改后的代码：

<div>
    <!-- 侧边栏 宽度可变化  -->
    <aside></aside>
    <!-- 主页面 -->
    <div style="position: relative;">
        <some-body />
        <!-- 相对于主页面(父div)设置position: absolute; bottom: 0; width: 100%;  -->
        <footer-bar />
    </div>
</div>

# css # 固定定位

上一篇: dedecms怎么删除会员

固定定位元素宽度跟随移动，如何解决？

随便看看