Prices for featured collection changing on desk top preview but not on the actual mobile view

[BK01]

I have added some code to reduce the size of my featured collection text and prices and it seems to have worked when I preview both the desktop and mobile versions, When I open shopify on my mobile though thew prices still look larger. 

This is the code I am using in the base.css for mobile, I have it at the very bottom

@media only screen and (max-width: 749px){
.price {
font-size: 1rem !important;

 

 

 

[TerenceKEANE]

Hi,

First of all, which browsers are you using? For both desktop and mobile, browsers sometimes interpret the code differently. What is the link to your website?

Terence.

[BSSCommerce-B2B]

Hi @BK01 ,

As for the issue you mentioned, I have reviewed the solution and found that your approach is correct, but seem like you missing } in your css code? Need 2 "}" for fix error convention.

@media only screen and (max-width: 749px){
  .price {
    font-size: 1rem !important;
  }
}

Or, you can try exactly class wrap price is : 

@media only screen and (max-width: 749px){
  .price .price__container {
    font-size: 1rem !important;
  }
}

I tried on my demo store, the result will be: 

I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.

Have a nice day sir!