Change Sale Price order

Hello,

For different reasons, I need to change the place a sale prices takes on the single product page.
Right now, the “old” price appears with a line in the middle and to the left of the “sale” price.
I need to change it, so it’s on the other side.

I know there are some CSS tricks to do this. Is there a way to change it in the template (HTML)? If there isn’t, what’s the best way to do it via CSS?

Thanks!

Hi,

Try to add the following code snippet to the Custom CSS area in Theme Settings to fix this issue.

.single-product-page .price {
	display: flexbox;
	display: flex;
	display: -webkit-flex;
	display: -ms-flex;
	flex-direction: row;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	-webkit-justify-content: flex-start;
	-ms-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-align-items: baseline;
	-ms-flex-align: baseline;
	align-items: baseline;
}

.single-product-page .price del {
	-webkit-order: 1;
  	-ms-order: 1;
  	order: 1;
  	margin-left: 5px;
}

Regards

[Author]

Posts