# 商品の縦幅変更 **URL:** \ **Category:** 技術的なQ＆A\ **Tags:** css, html\ **Created:** [March 20, 2024, 8:47am UTC](https://community.shopify.com/t/topic/306884 "2024-03-20T08:47:53Z")\ **Posts on this page:** 2\ **Page:** 1 ## AI-generated summary ・テーマ「craft」で、モバイルのコレクション表示を2列から3列に変更。各商品の枠（画像・商品名・価格を含む）の縦幅が長いままで、短くするCSSコードを求めている。 ・回答では、縦幅は画像の高さとテキスト量で決まるため、任意に削るのは基本的に困難と説明。短縮には画像・商品名・価格のいずれかを非表示にする必要がある可能性が高い。 ・縦幅を固定し、はみ出した内容をスクロール表示（CSSのoverflow）にする方法もあるが、価格などが見えずユーザー体験が悪化する懸念がある。参考: MDNのoverflow解説。 ・具体的なコードや実装手順の提示はなし。質問の解釈が正しければ、根本的な解決は難しいとの見解。 ・必要であればエキスパートやパートナーへの相談を推奨。現時点で解決策は確定せず、議論は未解決の状態。
**Author:** ![canami](https://avatars.discourse-cdn.com/v4/letter/c/4491bb/32.png) [@canami](https://community.shopify.com/u/canami)\ **Post date:** [March 20, 2024, 8:47am UTC](https://community.shopify.com/t/topic/306884/1 "2024-03-20T08:47:53Z")
テーマcraftを使用しています。 本来、商品コレクションの表示列がmax2列のところ、コードを使用し3列表示へ変更しました。(モバイル版) 3列表示になったのところまでは良かったのですが、縦幅は2列の時と変わっていないのか、 商品ひとつひとつが縦長な表記になってしまっているのが気になります。 縦幅(商品画像、商品名、価格を含む枠の縦幅)を変更するコードがあればご教授いただきたいです。 よろしくお願い致します。 ---
**Author:** ![Jizo\_Inagaki](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/jizo_inagaki/32/149480_2.png) [@Jizo\_Inagaki](https://community.shopify.com/u/Jizo_Inagaki)\ **Post date:** [April 1, 2024, 11:20am UTC](https://community.shopify.com/t/topic/306884/2 "2024-04-01T11:20:00Z")
> _縦幅(商品画像、商品名、価格を含む枠の縦幅)を変更するコード_ 現状を把握できていませんが、おそらく上記は実現困難かと思います。 画像の高さとテキスト量に応じて縦幅が決まるため、基本的に縦幅を削るには画像か商品名か価格を消す必要があるためです。 縦幅を固定してスクロールさせる方法もなくはないですが、価格などが見えなくなるためよくない状態かなと思います。 (参考: [https://developer.mozilla.org/ja/docs/Web/CSS/overflow](https://developer.mozilla.org/ja/docs/Web/CSS/overflow) ) 以上ですが、質問の趣旨を勘違いしている場合は申し訳ありません。 趣旨があっている場合でどうしても何とかしたいということであれば、解決策が見つかるかはわかりませんがエキスパートやパートナーに相談されることをお勧めします。