Make smaller product title

[Szymon9]

Hello I have a question, how can I make this product title and price smaller on mobile?

[sahilsharma9515]

Hi @Szymon9 

Can you please provide your store URL and password as well if applicable, so that I can provide you solution that can work for your store.

Best regards

Sahil

[Szymon9]

https://fibgy0as1msi2aaa-86580068677.shopifypreview.com

[sahilsharma9515]

Hi @Szymon9 Thanks for providing the URL, Please add the code in your theme.css/base.css/style.css file which is available in your theme.

@media screen and (min-width: 680px) {
.card__heading {
    font-size: 14px;
}

.card-information>*:not(.visually-hidden:first-child)+*:not(.rating):not(.card__information-volume-pricing-note) {
    font-size: 14px;
}
}

If you are not sure where is your theme.css/base.css/index.css/style.css file please follow the steps:

1. Login in shopify admin.
2. Click on the Online Store.
3. Then click on the button next to Customize in live Theme.
4. Click Edit Code.
5. Search theme.css/base.css/index.css/style.css in the code in left hand side which ever is available in your theme.
6. You can add the above code at the bottom of the file.

Result:

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

Best Regards

Sahil

[Szymon9]

I paste this code at the bottom of base.css file and nothing change

[sahilsharma9515]

Hi @Szymon9 Are you checking in phone or desktop?

please specify, also please try this code first.

@media screen and (min-width: 680px) {
 .card__heading {
    font-size: 14px !important;
 }

 .card-information>*:not(.visually-hidden:first-child)+*:not(.rating):not(.card__information-volume-pricing-note) {
    font-size: 14px !important;
 }
}

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

Best Regards

Sahil