How to change product description font size

Store Design
,
1

Hi there, I am struggling with some text size issues and I could really use some help!

My product description font sizes need to be changed on all devices: desktop 16px and mobile 13px. Also Ipad etc. I want them to scale automatically.

Anyone knows how to do that?

Thanks!

2

Hello @AnneP96 ,

I understand you are looking to adjust the Font-Size as per the screen.

You can adjust the Font-size with the mentioned CSS code.

Add the code at the bottom of the theme.liquid file before tag and save.

[Please feel free to change the font-size pixel]

Output -: https://prnt.sc/_j57GLezoPy-

I hope the code helps you.

Please share if you have any queries.

Thank you.

3

@AnneP96 Please follow below steps to change product description font size. Let me know whether it is helpful for you.

  1. From admin, go to “Online Store” → “Themes”.
  2. Click action button from the current theme and select “Edit code”.
  3. Go to “base.css” file and paste the below code at the bottom of the file and save changes.
.product__info-wrapper .product__description * {
    font-size: 16px !important;
}

@media screen and (max-width: 991px) {
  .product__info-wrapper .product__description * {
    font-size: 15px !important;
  }
}

@media screen and (max-width: 480px) {
  .product__info-wrapper .product__description * {
    font-size: 13px !important;
  }
}

Result will be like,

Vinsinfo_1-1716821135145.png
Vinsinfo_1-1716821135145.png1342Ă—627 241 KB

Vinsinfo_3-1716821362455.png
Vinsinfo_3-1716821362455.png703Ă—542 22.7 KB

Vinsinfo_2-1716821173963.png
Vinsinfo_2-1716821173963.png360Ă—533 18 KB

Please provide your support by click “Like” and “Accepted” if our solution works for you. Thanks for your support.

1 Like
4

This did the job! Thanks so much!!

5

Hi, I am trying this code. But it is showing invalid