問題タブ [gutter]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
10 に答える
106672 参照

twitter-bootstrap - ブートストラップ 3 ガター サイズ

ブートストラップを使い始めたばかりで、目標を達成する方法がわかりません。

この画像のように、ガターをすべて均等にしたいと思います。

ここに画像の説明を入力

デフォルトでは、これらは次のように表示されます。列間の垂直ガター (青色でマーク) は、水平ガターと外側ガターの 2 倍です。

ここに画像の説明を入力

これを解決するための最良の方法についての助けは、おそらく感謝されます。

0 投票する
3 に答える
113327 参照

margin - Bootstrap 3グリッドシステムでガターを調整するには?

新しい Bootstrap 3 グリッド システムは優れています。すべての画面サイズでのレスポンシブ デザインではより強力で、ネストされたデザインでははるかに簡単です。

しかし、私には理解できなかった問題が1つあります。列の間に正確なギャップを追加するにはどうすればよいですか? コンテナーが 960px、310px に 3 列、3 列の間に 15px に 2 つのガターがあるとします。それ、どうやったら出来るの?

0 投票する
3 に答える
979 参照

html - 流動的なグリッドと固定されたガターを備えた等しい高さの隣接する div

ここで、ガターが固定された流体グリッドに関する複数の質問と回答を見てきました。また、同じ高さのフルイド幅の div 列についても多く見てきました。私は両方を同時にやろうとしていますが、具体的な解決策は見つかりませんでした。

私はそれを機能させることができましたが、私の解決策は少し「ハッキー」で不安定なようです。以下は、jsFiddle リンクを使用した私のマークアップです。これは、ガターを固定して同じ高さの流体幅の div を実現する安全な方法ですか、それともより良い解決策をお勧めしますか? 最近、セマンティクスを改善し、堅牢なコードを作成しようとしています...

**ブラウザーのサポートには IE9+ のみが必要です

jsフィドル

HTML

CSS

私の最大の懸念は、空のガター div です。建設的なフィードバックをいただければ幸いです。

0 投票する
1 に答える
1545 参照

twitter-bootstrap - ブートストラップ 3.1.1 で複数のブレークポイントに一貫したグリッド ガター幅を追加する方法

私は最新のブートストラップを使用していますが、レスポンシブ グリッドのアイテム間に単純なマージンを追加することができません。col 設定 (col-lg / col-md / col-sm / col-xs) に基づいて 4 / 3 / 2 / 1 列からスケーリングする単純なグリッドがあります。

上記のレイアウトでアイテム間の単純なマージンを取得するために、デフォルトのスタイル(または less プロパティを直接)をオーバーライドする簡単な方法が欲しいです。

デフォルトでは、これは正しくスタックされますが、各アイテムは互いに直接隣り合っています。最小限のハッキングで必要なガター幅を実現するにはどうすればよいですか?

0 投票する
1 に答える
1635 参照

css - ブートストラップ 3: 異なるコンテナー幅のガター幅を計算する方法

提供されたデザインに基づいて、ブートストラップのコンテナー幅を 981px に変更しました。

ガターの幅が 30px に設定されていることに気付きましたが、コンテナーの幅が異なる場合、適切な幅をどのように判断すればよいですか?

コンテナの最大幅を 981px に維持したいのは、デザイナーが Photoshop でレイアウトを実装した方法だからです。

たとえば、幅が 981 ピクセルで、コンテナーの幅全体にまたがる画像があります。

0 投票する
2 に答える
186 参照

css - CSSガターオーバーフローボディ

私の自家製の CSS グリッドに問題があります。.row のエッジがボディのエッジに接触すると、オーバーフローが発生します。ここでデモを参照してください: http://jsfiddle.net/57BGe/3/説明のために 更新

どうすればオーバーフローを防ぐことができますか? (オーバーフロー: なし。電話ではまだスクロールでき、デスクトップではある程度の力でスクロールできるため、機能しません)

* UPDATE * Bootstrap を見ると、 # http://getbootstrap.com/css/ dev コンソールを使用してみて、.row の margin-left を body でオーバーフローするものに変更してください。(例: -150px)
これを行っても、水平方向にスクロールできません。