角度を使ってフローティングコンテナにサムネイルを表示するにはどうすればよいですか？

Question

私はいくつかのサンプル製品を作成しました。今、私はそれをうまく表示することができましたが、何とか製品が垂直に表示されます。私はそれが次の行に移動することができます次のサムネイルが浮遊スペースを最大にしたら、それを水平に表示したいと思います。

私はフローティングコンテナを作成し、その内部に* ngforを配置しました。私が行方不明のものは何ですか？

はここで、

<div class="text-center m-t-lg"> 
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" rel="stylesheet"> 


    <h1>Public Shared Diary</h1> 

    <div class="container-fluid"> 

    <div *ngFor="let pub_diary of diaries_temp;let i = index" [attr.data-index]="i"> 

    <div class="container-fluid"> 
     <div class="thumbnail" style="min-height:320px;height:320px;min-width:220px;width:220px;"> 
     <h2>Project title = {{pub_diary.project_name}}</h2> 
     <img style="min-height:150px;height:150px;" src="{{pub_diary.project_image}}"> 
     </div> 
    </div> 

    </div> 
    </div> 



</div> 

私のhtmlコードであり、ここで、電流出力です。赤いマーキングはサムネイルが好きな場所です。

Answer 1

私は答えを見つけた

.thumbnail {display: inline-block; vertical-align: middle;} 

Answer 2

を追加します。私は、新しいdivを作成して、aを含める必要があります。

問題を解決しました。