Make pricing font size smaller

[VinUp]

Hi, how do you make the font size for the pricing on the mobile version smaller? It only has to be for the pricing at the top just below the rating. The website is: https://vinup.nl/en/products/vinyl-record-rack

[LizHoang]

Hi @VinUp 

- You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file base.css and add this code at the end of the file

@media (max-width: 768px) {
s.price-item.price-item--regular {
    font-size: 15px !important;
}
}

Result: 

Best,

Liz

[rajbhai]

Add This Code In Edit Code > Base.css File 

@media only screen and (max-width: 600px) {
  body .product .price--on-sale .price-item--regular, body .product .price .price-item {
     font-size: 16px !important;
  }
}

[ZestardTech · Accepted solution]

Hello @VinUp,

Here are the steps to apply the necessary changes in your Shopify store:

1. In your Shopify Admin, navigate to Online Store > Themes > Actions > Edit Code.
2. Locate Asset > base.css and paste the following code at the bottom of the file:

@media screen and (max-width:768px){
.price-item.price-item--regular {
    font-size: 1.6rem !important;
}
.price.price--large.price--on-sale.price--show-badge span {
    font-size: 1.6rem !important;
}
}

Let me know if you need further assistance!

[rajbhai]

Add this code in edit code > base.css and add this code at the end of the file

@media only screen and (max-width: 600px) {
  body .product .price--on-sale .price-item--regular, body .product .price .price-item {
     font-size: 16px !important;
  }
}