haml、scssで子要素を横と下に並べたい

Question

前提・実現したいこと

haml,scssでレイアウトを作成しています。
https://gyazo.com/47b259188aebaa151d9d8938e0e9e6fe
画像が横に３つ並ぶと４つ目は下に並んでほしいのですが、なにかキーワードでいいので
教えて欲しいです。

発生している問題・エラーメッセージ

該当のソースコード

.Contents
  - @photos.each do |photo|
    .Content
      .Content__name
        = photo.name
      .Content__image
        = image_tag "#{photo.image}", height: '300', width: '400'
      .Content__text
        = photo.text

.Contents{
  height: calc(100vh - 90px);
  background-color: #f5f5f3;
  display: flex;
  justify-content: space-between;
  overflow: scroll;
  Content{
    display: inline-block;
    height: 300px;
    width: 400px;
    background: #fff;
    
    &__name{

    }
    &__text{

    }
    &__image{    
      }
   }
}

試したこと

インラインブロック要素などの言葉を調べながら検証中です。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Answer 1

floatを試し中です

Comments

[kazuki1722]

https://gyazo.com/1d55e46a81cce5898b7e5064a74e19f9
floatを試すと要素は下に回り込むようになりましたが、少しレイアウトが左によってしまいます。
なにか解決できそうなものはないでしょうか。