FROM CACHE - jp_header
このコミュニティはピアツーピアサポートに移行しました。Shopify サポートは今後、このコミュニティへのサービスを提供いたしません。これからもぜひ、他のマーチャントやパートナーとつながり、サポートし合い、経験を共有してください。 当社の行動規範に違反する行動や削除を希望するコンテンツがありましたら、引き続きご報告ください

モバイルでの商品グリットの列数3列で表示させる方法

解決済

モバイルでの商品グリットの列数3列で表示させる方法

0625
訪問者
1 0 0

「Dawnのバージョン9.0.0」でモバイルでの商品グリットの列数3列で表示させるコード編集方法を教えていただきたいです。

 

1 件の受理された解決策

株式会社フルバランス
Shopify Partner
1623 576 750

成功

0625さま

 

はじめまして、フルバランスの渡邉です。

ご質問を確認いたしました。

以下CSSの50%を33%に書き換えることで可能かと思います。

(100%の幅を何分割するかという考え方なので、4列にしたい場合は25%になります)

 

@media screen and (max-width: 749px)
.grid--2-col-tablet-down .grid__item {
width: calc(50% - var(--grid-mobile-horizontal-spacing) / 2);
}

 

参考になりましたら幸いです。

私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

分からない点があれば、またいつでもご連絡ください。

フルバランス 渡邉

株式会社フルバランス
Shopify専門のEC成長支援会社です。ストアの新規構築から運用や改善のサポートなどShopifyに関する幅広いサービスを行なっております。
ECの技術・実務・成長、お悩みのことがあれば、お気軽にご相談ください。
『つくる人、売る人の成長と成功を最大化する。』 株式会社フルバランス

元の投稿で解決策を見る

1件の返信1

株式会社フルバランス
Shopify Partner
1623 576 750

成功

0625さま

 

はじめまして、フルバランスの渡邉です。

ご質問を確認いたしました。

以下CSSの50%を33%に書き換えることで可能かと思います。

(100%の幅を何分割するかという考え方なので、4列にしたい場合は25%になります)

 

@media screen and (max-width: 749px)
.grid--2-col-tablet-down .grid__item {
width: calc(50% - var(--grid-mobile-horizontal-spacing) / 2);
}

 

参考になりましたら幸いです。

私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

分からない点があれば、またいつでもご連絡ください。

フルバランス 渡邉

株式会社フルバランス
Shopify専門のEC成長支援会社です。ストアの新規構築から運用や改善のサポートなどShopifyに関する幅広いサービスを行なっております。
ECの技術・実務・成長、お悩みのことがあれば、お気軽にご相談ください。
『つくる人、売る人の成長と成功を最大化する。』 株式会社フルバランス