twitter-bootstrap - Twitter-Bootstrap -- 検索フィールドの下に Navbar 検索ボタンが表示される

Question

うわぁ。私はすべてを試しましたが、これを理解できません。明らかな何かが欠けていることは確かです。

検索ボタンを検索フィールドの横に表示したいのですが、何らかの理由でその下に表示されます。私は一体何を逃したのですか？

<div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".main-navbar">
    <span class="sr-only">Toggle navigation</span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
  </button>
  <a class="navbar-brand" href="#">The Brand Goes Here</a>
</div>

<!-- toggled items -->
<div class="collapse navbar-collapse main-navbar">
  <form class="navbar-form navbar-left" role="search">
    <div class="form-group">
      <input  type="text" class="form-control" placeholder="search">
    </div>
    <button type="submit" class="btn btn-default">submit</button>
  </form>
</div>
<!-- end toggled items -->