注释导致代码显示不正确（CSS/Bootstrap）

Question

这是我遇到的最奇怪的事情之一。 COMMENT（或缺少）导致输出发生变化。见下文，注意中间的<!-- 和-->。

    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
        <div class="row">
            <div class="col-xs-6 col-md-8 col-lg-8 vertical-center">
                <h2>
                    TEST
                    <small>
                        <span>Test</span>
                    </small>
                </h2>
            </div><!--
        --><div class="col-xs-6 col-md-4 col-lg-4 vertical-center">
                <h2 class="text-right skip-pause-buttons">
                    <span class="glyphicon glyphicon-step-backward"></span>
                    <span class="glyphicon glyphicon-pause"></span>
                    <span class="glyphicon glyphicon-step-forward"></span>
                </h2>
            </div>
        </div>
    </nav>

如果我有它，它显示正常。如果我删除它，代码将停止正确显示。看这张图片：

最上面的情况没有注释（出于某种原因，它显示在两行）。 底壳是 WITH 注释（显示正确）。

到底发生了什么？

---

编辑：我刚刚注意到如果它与它在同一行（即使没有注释）它显示正确。但是一旦它在不同的行上，它就会停止正确显示。

Answer 1

cmets 用于删除两个元素之间的任何空白（您可以使用 float left 达到相同的结果）

通常最好仅将网格类用于网格目的。