ブートストラップのカラムの高さがより良くなる

カラムの終わりを待つのではなく、残りのスペースを取るようにカラムを取得しようとしています。 col-lg-6で2つのdivに使用し、div-insideをcol-lg-12に設定する最良の方法はありますか？私は正しい方法でブートストラップを使用していることを確認し、早い段階で悪い習慣を取り除きたいと思っています。それは写真ブートストラップのカラムの高さがより良くなる

私の現在のビュー

予想結果でそれをする

出典

2017-04-13 Bish25

唯一の方法はjQueryのは**アイソトープ呼ばplugingである表示するために容易になります* *（または** masonery **）。
アイソトープ> http://isotope.metafizzy.co/layout-modes/fitcolumns.htmlを好む – Roy

[ブートストラップの列を最小限の垂直スペースにする]の可能な複製（http://stackoverflow.com/questions/32272964/） make-bootstrap-columns-take-up-the-least-vertical-space） – Abhitalks

メイソングリッドが必要なようです。私はそれについての記事を見つけた[記事。]（https://www.sitepoint.com/bootstrap-tabs-play-nice-with-masonry/） – stojkosd

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>Bootstrap</title> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
</head> 
<body> 

<div class="container"> 

    <div class="row"> 
    <div class="col-md-6" style="border:1px solid #777777;"> 
     <div class="row"> 
     <div class="col-md-12" style="border:1px solid #777777;height:100px;"> 
     </div> 
     <div class="col-md-12" style="border:1px solid #777777;height:140px;"> 
     </div> 
     </div> 
    </div> 
    <div class="col-md-6" style="border:1px solid #777777;"> 
     <div class="row"> 
     <div class="col-md-12" style="border:1px solid #777777;height:150px;"> 
     </div> 
     <div class="col-md-12" style="border:1px solid #777777;height:100px;"> 
     </div> 
     </div> 
    </div> 

    </div> 
</div> 

</body> 
</html>

出典

2017-04-13 10:32:15

ブートストラップのカラムの高さがより良くなる

答えて

関連する問題