レスポンシブでの商品一覧の改行位置について

Question

お世話になっております。

https://qiita.com/rhirayamaaan/items/b7a1b49e985fffa958be
を参考に下記の商品一覧のページを作っております。
ただ、上記のページはスマホを基準で作られているので、自分が作っているページはPCメインに変えて作成しています。
↓自作ページ
https://www.rakuten.ne.jp/gold/sunrise-shoes/item/index.html
ビーノに入れるので、周りの余白は不要なのですが、
スマホの幅にしたときに赤い枠の部分のようなスペースが入ります。
スペースを無くして左詰めで表示させるにはどうすればよいでしょうか？###HR######IMG01f4e949556c9dcd81e511093302af529.jpegIMG0###

Accepted Answer

ECマスターズの大谷です。

>https://qiita.com/rhirayamaaan/items/b7a1b49e985fffa958be
>を参考に下記の商品一覧のページを作っております。
>ただ、上記のページはスマホを基準で作られているので、
>自分が作っているページはPCメインに変えて作成しています。

>↓自作ページ
>https://www.rakuten.ne.jp/gold/sunrise-shoes/item/index.html
>ビーノに入れるので、周りの余白は不要なのですが、
>スマホの幅にしたときに赤い枠の部分のようなスペースが入ります。
>スペースを無くして左詰めで表示させるにはどうすればよいでしょうか？

以下のCSSにて、
スペースを無くして左詰めで表示が可能です。

参考資料ですと、flex-boxを使用しない方法と
なっておりましたが、flex-boxを
使用した方法でのご案内となります。

====================
.itemList__items {
display: flex;
flex-wrap: wrap;
}
====================

上記のCSSを適用して頂き、
ご確認頂けますと幸いです。

よろしくお願いいたします。

Answer

ECマスターズの大谷です。

いただいたご質問ですが、確認いたしますので、
恐れ入りますが、ご回答まで今しばらくお待ちいただきますよう
お願いいたします。

Answer

ECマスターズ　大谷さま

ご返信いただき、ありがとうございます。
早速CSSを追加したところ、無事左詰めで表示されました！
お手数をおかけしました。ありがとうございました。