2016-11-12 4 views
0

私は過去数週間、ブートストラップを使用していました。グリッドシステムとHTML5データ属性の面白い使い方が大好きですが、 。ブートストラップのコンテンツの間隔

私はrowを次々に、あるいは単にコンテナとして作成することができます。また、各列(col-md-*)の間にはっきりとしたくぼみがあります。

私の最近のプロジェクトでは、いくつかのコンテナの間に垂直マージンを追加するためにいくつかの仕切りクラスを作成しましたが、これは冗長な感じです。

コンテンツを正しく配置するにはどうしたらいいですか?

+0

ハードCSSは唯一の方法です...私は推測しますか? –

答えて

0

ブートストラップに特別なクラスはありません。しかし、私はそれが良いのだと思う。

ブートストラップは、いつも「知っている」わけではありません。自分で作成する必要があります。それはあなたが開発者である理由です:)これらのソリューションで

ルック:Add vertical blank space using twitter bootstrap

1)form-group

<div class="form-group"> 
    &nbsp; 
</div> 

2ブートストラップビルドでクラスを使用)、またはあなたが必要とするすべての行の後に追加のブロックを追加します:

<div class="col-xs-12" style="height:50px;"></div> 

3)、または新しいクラスを作成し、必要なすべてのrow後に追加のブロックを追加:

CSS:

.spacer { margin:0; padding:0; height:50px; } 

はHTML:

<div class="spacer"></div> 

4)または、あなたは本当に後にすべての行要素をスペースが必要な場合は、rowクラスの追加のスタイルを追加します。

.row { padding-bottom: 50px } 

例:https://jsfiddle.net/3a36p06h/