CSS <p> 宽度百分比在线缩小窗口调整大小（左 - 右）答案

【问题标题】：CSS <p> width on percentage online shrinks on window resize (left - right)CSS <p> 宽度百分比在线缩小窗口调整大小（左 - 右）
【发布时间】：2015-10-16 22:15:22
【问题描述】：

我有这个页面（用于练习网络编程）女巫在底部有一个页脚。 http://i333180.iris.fhict.nl/melissa/index.html

因为网站可能需要在不同的窗口大小上打开，所以我使用 margin-top 百分比。

margin-top: 38%

我遇到的问题是通过从下到上缩小窗口，页脚停留在他的位置。但是通过从左到右缩小窗口，页脚位置会发生变化。

我用谷歌搜索了一下，html、body 和被包围的 div 必须得到什么

height:100%;

所以添加了这个，但页脚不会改变窗口调整大小（自下而上）的位置。这只能用

解决吗

position:absolute;
left: somevalue;
top: somevalue;

【问题讨论】：

尝试vh 而不是%（用于保证金）。但无论哪种方式，如果您希望它保持在底部的位置，请考虑将其设为 calc(100vh - something)。
边距：60vh 0 0;而不是保证金：35% 0 0 0 有效，但不是一直有效！：o

标签： html css

【解决方案1】：

将此css添加到.p-footer：

position: absolute;
bottom: 0px;
left: 25%;
right: 25%;

而且你应该去掉 margin 属性。

【讨论】：