一行中的多个 i 标记与多行

Question

我使用 text-align: justify 多个i 标签。它适用于多行中的多个 I 标记，但是当组合在一行中时，它不起作用。 你可以试试我的 jsfiddle https://jsfiddle.net/lhphuc210291/zvajLgfc/8/

html代码

<div class="m_grid">
        <i>abc</i>
        <i>def</i>
  <div class="m_justify_fix"></div>
</div>
<br/>
<div class="m_grid">
        <i>abc</i><i>def</i>
  <div class="m_justify_fix"></div>
</div>

css代码

.m_grid {
  text-align: justify;
  line-height: 0
}

.m_grid .m_justify_fix {
  display: inline-block;
  vertical-align: top;
  width: 100%;
  height: 0;
  overflow: hidden
}

第一个 div 标签可以正常工作，但使用第二个 div 就不行了。我想知道这两种情况有什么区别。因为我使用 Angular 组件 templateUrl 渲染 HTML。它是自动渲染 HTML 代码，i 标签和 css 之间没有换行符不起作用。

Answer 1

简单的答案：如果中间没有空格，就没有什么可以证明的。