カードは、ng-repeat（AngularJS）の改行時に位置を失います

Question

ng-repeatでアイテムをループしています。ここでは、コードは次のようになります。

<div class="row" 
<div class="w3-card-3 col-xs-18 col-sm-6 col-md-3" ng-repeat="p in products"> 
    <div class="thumbnail"> 
     <img ng-src="{{p.img}}" alt="..."> 
     <div class="caption"> 
      <h4 class="text-danger">{{p.brand}}</h4> 
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere, soluta, eligendi doloribus sunt minus amet sit debitis repellat. Consectetur, culpa itaque odio similique suscipit</p> 

      <a href="car/{{ p.id }}" class="btn btn-default btn-xs pull-right" role="button"><i class="glyphicon glyphicon-edit"></i> 
      </a> <a href="#" class="btn btn-info btn-xs" role="button">Info</a> 

      <a href="#" class="btn btn-default btn-xs" role="button">Bid</a> 
     </div> 
    </div> 
</div> 

私の問題は、リピーターが新しい行を入射した場合に発生するカードはめちゃめちゃますということです。

私のコードの何が問題なのです。ここでは、問題の画像ですか？なぜカードがお互いの下に揃っていないのですか？あなたが見たいものが他にもあるかどうか教えてください。

Answer 1

画像と説明ラッパーの使用の高さ、それは

Answer 2

はスタイル=追加してみてください「フロート：左」の下のdivにを：

<div class="thumbnail" style="float: left">