HTML5 在 jsFiddle 中工作时表现异常

Question

标题不是很会说话。使用以下代码，我希望 "Search" 和 "Logout" 这两个元素与徽标位于同一行，但完全对齐。

<div class="wrapper">
  <div class="ui block top attached header" style="margin-bottom: 0;">
    <div class="ui grid">
      <div class="nb_header left aligned two column row">
        <div class="three wide column">
          (Logo)
        </div>
        <div class="thirteen wide right aligned column">
          <div class="">
            <div class="ui action input">
              <input type="text" placeholder="Search..."/>
              <button class="ui button">Search</button>

            </div>
            <div class="ui action red button">Logout</div>
          </div>

        </div>
      </div>
    </div>
  </div>
  <div class="ui attached segment">
              ...content...

  </div>
</div>

当我为此 post 在 jsFiddle 中输入完全相同的代码时，我发现它的行为正常。这是 fiddle：http://jsfiddle.net/kr37euu1/4/

这是它在我的浏览器中的截图：

为了比较，我将 post jsFiddle 版本的另一个屏幕截图：

为什么它的行为不同？

Answer 1

我找到了答案。 fiddle和我的本地代码经过多次修改后，我发现唯一剩下的区别是CSS和semantic-ui的JS。使用 CDN 版本 1.12.3 似乎可行 - 尽管我的本地副本也是 1.12.3。

从 CDN 下载 minifed 版本并将它们放在我的本地实例中似乎解决了问题 - 为什么总是这样。

感谢大家的帮助。

HTML5 在 jsFiddle 中工作时表现异常

HTML5 behaving strange while working in jsFiddle

html

semantic-ui