読者です 読者をやめる 読者になる 読者になる

やったこと

webサービスを作るときに考えたことを垂れ流します

twitter bootstrapの入力フォームをインライン指定にしたのに効かない

twitter bootstrap(ver3.3.1)で、入力フォームと実行ボタンをform-inlineに指定して並べて表示したかったんだけど、ちょっとうまくいかなかった。

大きなウィンドウサイズのときはちゃんとinlineが効いてるみたいなんだけど、ウィンドウを小さくするとinlineが効かなくなってレイアウトが崩れてしまう。

↓コードはこんな感じ

<form class="form-inline" role="form">
  <div class="form-group">
    <input type="text" placeholder="入力" class="form-control">
    <button type="submit" class="btn btn-default">実行</button>
  </div>
</form>


bootstrap公式ページを見てみると、どうもform-inlineの指定はウィンドウサイズが768px以上のときでないと効かないみたいだ。

http://getbootstrap.com/css/
「This only applies to forms within viewports that are at least 768px wide.」

なんだよ、そういうことなら早く言ってくれよ・・・。