How to: Switch Order of Pricing [and] Smaller Pricing on Mobile

[ilovetogolf]

There are 2 things I need help with. I have Dawn 15.3.0 Theme. Site is: iLovetoGolf.com

1. I want the sale price to be on the left & the one crossed out on the right. [Photo Below]

2. I would like the sizing on mobile to be smaller than on the desktop version, as it takes up too much space. [Photo Below]

  

[WebDeskSolution]

Hello @ilovetogolf 

Please follow the steps below after logging into the Shopify admin:

• Go to your Shopify Admin panel.
• Click on Online Store > Themes.

• Find the live theme and then click Actions > Edit code.

• Search base.css
• Insert the provided CSS code at the end of the file and save the changes.

.card .card__information .card-information .price--on-sale .price__sale
{
    display: flex;
    flex-direction: row-reverse;
    gap: 10px;
    align-items: center;
}
@media screen and (max-width: 479px)
{
    .card .card__information .card-information .price--on-sale   .price__sale
{
        gap: 0;
        align-items: baseline;
        justify-content: flex-end;
        flex-direction: column-reverse;
    }
}

Please hit Like and Mark it as a Solution if you find our reply helpful.