5
インラインフォーム内の全幅テキスト入力をブートストラップする
コンテナー領域の幅全体に収まるテキストボックスを作成するのに苦労しています。 <div class="row"> <div class="col-md-12"> <form class="form-inline" role="form"> <input type="text" class="form-control input-lg" id="search-church" placeholder="Your location (City, State, ZIP)"> <button type="submit" class="btn btn-lg">Search</button> </form> </div> </div> 上記を実行すると、予想どおり、2つのフォーム要素はインラインになりますが、せいぜい数列を超えないようにしてください。Firebugでcol-md-12divにカーソルを合わせると、予想される全幅を占めていることがわかります。埋められないように見えるのは、テキスト入力だけです。インラインの幅の値を追加してみましたが、何も変わりませんでした。これは簡単なはずですが、今は本当に馬鹿げているように感じます。 ここにフィドルがあります:http : //jsfiddle.net/52VtD/4119/embedded/result/ 編集: 選ばれた答えはあらゆる点で徹底的であり、素晴らしい助けです。それは私が最終的に使用したものです。しかし、私の最初の問題は、実際にはVisual Studio 2013内のデフォルトのMVC5テンプレートの問題だったと思います。これには、Site.cssに含まれていました。 input, select, textarea { max-width: 280px; } 明らかにそれがテキスト入力の適切な拡張を妨げていました...将来のASP.NETテンプレートユーザーへの公正な警告...