内联块元素的保证金崩溃？

Question

块元素的边距会崩溃,但不会内联块.
有没有办法强制内联块边缘崩溃？

.wrapper {
    position: relative;
    float: left;
    width: 100px;
    margin: 10px;
}

.wrapper .el {
    display: inline-block;
    width: 100%;
    height: 20px;
    background: #000;
    margin: 10px 0;
}

.wrapper.block .el { display: block; }

<div class="wrapper">
    <div class="el"></div>
    <div class="el"></div>
    <div class="el"></div>
</div>

<div class="wrapper block">
    <div class="el"></div>
    <div class="el"></div>
    <div class="el"></div>
</div>

有人有想法吗？
我已经阅读了有关MDN的文档.

Answer 1

这一点在规范中有记录,即内联块元素的边距不会崩溃:

8.3.1折叠边距

• 浮动框和任何其他框之间的边距不会崩溃(甚至在浮动及其流入子代之间也不会).
• 建立新块格式化上下文的元素的边距(例如浮点数和"溢出"除"可见"之外的元素)不会因其流入的子节点而崩溃.
• 绝对定位的盒子的边缘不会坍塌(甚至没有流入的孩子).
• 内联块方框的边距不会崩溃(甚至不包括它们的流入子代).
• ...

因此答案是否定的.您可能需要更改元素的边距.