320pxのレスポンシブ対応

[dabo1031]

Welcart basicを使用していますが、320pxで表示した際に、カート情報確認ページの
商品名の横幅が狭くなり必要以上に文字の折り返しが発生しております。

こちらの編集方法をご教示頂けないでしょうか？

[ohnishi]

こんにちは

Welcart Basic の子テーマを作成いただき、
子テーマ内のCSS にメディアクエリ（320px未満）を記載して修正するような形になるかと思います。

@media screen and (max-width: 320px) {
	.cart_navi {
		background: ....;
	}
}

[dabo1031]

ohnishi様

ご返信ありがとうございました。

言葉足らずで申し訳ございませんでした。

・Welcart Basic の子テーマを作成
・子テーマ内のCSSにメディアクエリ（320px未満）を記載
・「wc_cart_page.php」の「<th class=”productname”><?php _e(‘item name’,’usces’); ?></th>」が
　該当箇所だと思いその部分を変更

までは実施いたしました。

実際に「style.css」に仮で下記のコードを記入すると背景色が変更されるところまでは
確認しております。

.productname {
background-color: #00B900;
}

しかし、ここから幅の修正が出来なかったのため、この部分の幅の修正方法をお聞きしたかったです。
変更したい箇所を示した画像を添付させて頂きます。

ご意見いただけると幸甚です。

Attachments:

You must be logged in to view attached files.

[ohnishi]

min-width を使用してみてはいかがでしょうか。
min-width は、要素の最小幅を設定することができます。

.productname {
	min-width: 100px;
}

などで変更できないでしょうか。

[投稿者]

投稿