在 CSS 中同时使用位置和显示的行为是什么?

问题描述

我正在尝试在页面底部制作一个宽度为 100% 的页脚。使用 position: absolute;。我可以使用给定的代码实现位于底部的页脚。但是,即使在添加 display: block; 之后,我也无法获得 100% 宽度的页脚。我想知道在定位方面将这两个一起使用是什么意思。例如位置是否覆盖显示值?提前致谢。

footer {
    text-align: right;
    position: absolute;
    /* display: block; */
    bottom: 0%;
    right: 0%;
    background-color: rgba(232,232,228,0.5);
    border: 1px solid #fcd5ce;
}

解决方法

position: absolute 元素的行为与 display: block 元素相同,因此您的 display 无效。这是一个很好的解释:CSS: display:inline-block and positioning:absolute

设置 width: 100% 应该可以解决您的问题。