使用Haml的与直列块间距的间隙(Using Haml with the inline-block

所以，我阅读了有关使间距走开使用inline-block的时候，而不是浮在解决方案： 显示器：inline-block的额外保证金和http://css-tricks.com/fighting-the-space-between-inline-block -elements / 。

所以，如果你正在使用HAML，并希望把结束标记在同一行作为下一个开放标签，是有除了切换到ERB的解决方案？

（不，我不想与父容器的CSS属性烂摊子，要重写，在所有的子元素）。

这打破（具有锚之间的间距）。

因此，它是真实的，尽管建议使用inline-block的做这样的布局，而不是浮动，似乎浮仍然要走的路，尤其是在使用HAML什么时候？

CSS

nav a {
  display: inline-block;
  padding: 5px;
  background: red;
}

HTML

<nav>
  <a href="#">One</a>
  <a href="#">Two</a>
  <a href="#">Three</a>
</nav>

解决方法（CSS-招数之一）：

<ul>
  <li>
   one</li><li>
   two</li><li>
   three</li>
</ul>

要么

<ul>
  <li>one</li
  ><li>two</li
  ><li>three</li>
</ul>

另一个：

<ul>
  <li>one</li><!--
  --><li>two</li><!--
  --><li>three</li>
</ul>

Answer 1:

我找到了答案： http://haml.info/docs/yardoc/file.REFERENCE.html#whitespace_removal__and_

（这是关于这一主题的超级有用的文章： http://designshack.net/articles/css/whats-the-deal-with-display-inline-block/ ）

这里有一个codepen实验： http://cdpn.io/Bjblr

而这个工作：

这里的HTML，如果锚文本是在同一行（相同的结果，但难以阅读HTML源文件：

文章来源: Using Haml with the inline-block spacing gaps