<span>包装<div>时出现意外的换行符(dis)

时间:2017-12-03 16:19:45

标签: html css

.outline-1 { outline: darkred 2px dashed; }
.outline-2 { outline: aqua 2px dashed; }
.outline-3 { outline: blue 2px dashed; }
body { margin: 0; padding: 50px;}
.wrap { margin: 0; padding: 0; background-color: white;}
.one, .two {
  margin-left: -15px;
  margin-right: -15px;
}
.oneone, .twotwo {
  display: block;
}

.no-margin {
  margin-left: 0;
  margin-right: 0;
}

.block-text:before {
  display: block;
  content: '[block]';
}

.inline-text:before {
  display: inline;
  content: '[inline]'
}
<div class="wrap outline-1">
  <span class="one outline-2">
    <div class="oneone">aaa bbb</div>
  </span>
  <span class="two outline-3">
    <div class="twotwo">bbb aaa</div>
  </span>
</div>

为什么非零边距(右边)会在span.one开始之前导致换行?将.no-margin应用于span.onespan.two时,换行符会消失

我猜这是导致换行的孩子div,但是只有当左边距或右边距都非零时才能知道为什么会发生这种情况。

+ .no-margin应用于span.onespan.two时,换行符会消失←这是此问题的主题。我知道如何出现换行符,但不知道换行符如何消失

  

这与this question不重复。这并不能解释为什么零保证金会删除换行符。

0 个答案:

没有答案