主な質問は、ブートストラップレスポンシブCSSをカスタマイズする方法ですか？私のコードは部分的に機能しますが、このケースを修正することはできません。説明するのは難しいので、理解を深めるために、スクリーンショットに視覚化を表示しました。
実際にクリーンアップされたテンプレートコードをJSFIDDLEに投稿しました。
幅が1200pxを超える場合、列は2つのspan6が並んでいることを意味します
。1200pxと980pxの間の表示は、次のよう
になります。コンテナの中心：
768px未満の次の縮小まで、右の列は新しい行にジャンプし、さらに480px以下に縮小するときにそこにとどまります。以下に示すビューは、モバイルデバイスでは問題なく、狭いデスクトップブラウザーで見栄えが良くなると思います。ただし、スケールすると、両方の列が中央に配置されません。
最小幅は私の期待に対応しています。
あなたの質問が正しいかどうかはわかりませんが、メディアクエリを使用して動作をカスタマイズできます
// Landscape phones and down
@media (max-width: 480px) { ... }
// Landscape phone to portrait tablet
@media (max-width: 767px) { ... }
// Portrait tablet to landscape and desktop
@media (min-width: 768px) and (max-width: 979px) { ... }
// Large desktop
@media (min-width: 1200px) { ... }
たぶん、いくつかのクラスとIDを上書きする必要があります。レスポンシブ情報はgitで見つけることができます：
それでも、本当に必要な場合にのみ、これらの設定で遊んでください。