Question

我有一个特殊的页面（内部元素），它应该忽略外部填充，但它必须是100％宽。每个页面周围都有一个容器，填充量为10px。

因此，负利润将导致低于100％的某些因素，因为有些百分比是隐藏的溢出。

margin-left: -10px /* 10px is the padding of the outer element */

如果没有移动内部元素，有没有办法忽略外部填充？
那么移除外部的填充物是可能的，但实际上需要付出很多努力。

Answer 1

是的，我可以自己解决。可能不是最好的解决方案，但它对我有用。太好了。

.inner {
    width: calc(100% + 10px);
    margin-left: -10px;
}

Answer 2

如果我正确理解了问题，您可以使用否定margin + padding的组合来实现这一目标。

＆＃13;

.outer {
    padding: 10px;
    background: pink; /*you should not see this*/
}
.inner {
    margin: -10px;
    padding: 10px;
    background: gold;
}

＆＃13;

<div class="outer">
    <div class="inner">hello world!</div>
</div>

＆＃13;

如何忽略父级填充真正的100％宽度？

2 个答案: