为何CSS为.footer-text设置的margin-left:5%未生效？

你为.footer-text设置的margin-left未达到预期效果，核心原因是你将该类加在了<span>元素上：
<span>是HTML默认的行内元素，对应display: inline属性，这类元素的外边距生效逻辑和块级元素有本质区别：

• 行内元素的水平方向外边距仅会作用在元素的起始排布位置，也就是只会把元素的第一行文本向右推开指定距离
• 当文本长度超出容器宽度触发自动折行时，第二行及之后的续行内容会直接对齐父容器的左边缘，不会跟随第一行的偏移量缩进，因此就出现了你看到的“只有第一行右移、续行顶格”的异常效果。

根据你的布局需求二选一即可：

• 方案1：修改.footer-text的显示模式，让外边距作用于整个元素的盒模型，所有行（包括续行）都会统一偏移：

.footer-text {
  margin-left: 5%;
  display: block;
  /* 如果需要该元素和其他行内内容保持同排，可替换为 display: inline-block; */
}

• 方案2：如果不想改动当前span的显示模式，可以直接给承载免责声明的父级容器添加padding-left: 5%，让容器内所有内容统一向右偏移5%，也能达到整段缩进的效果。

内容的提问来源于stack exchange，提问作者Jack Green