Question 108326 in Wordpress Question posted in
The official Wordpress documentation can be found here.

WordPress – Sale price as Superscript above Regular price – requires separate block WooCommerce

I’m trying to display the woocommerce sale price just above the regular price as a Superscript.
I wish I could achieve it with simple CSS but it doesn’t stay exactly where I want it to stay.

When I type the CSS code discount price moves a little up but I can’t get it to stay just right above it.
It’s because Discount and Regular prices are on the same class block. I believe if we can move the discount price to a separate div/class block higher on the hierarchy then I can use the CSS and get it where I want.

vertical-align: super;

How I want it to be
Block view

I would appreciate any help and please don’t be harsh with me I’m a newbie.

Tags:

2

Answers


  1. 0

    You should be able to open that price HTML and see a separate section for the sale price. The attached screenshot shows a standard Woo installation. As far as I can recall, they should never be stuck in the same container with the same class. enter image description here

    Login or Signup to reply.
  2. 0

    i think you could add some CSS to your child theme.

    Just tried on my theme and it works > see Screenshot

    span.price.amount.final ins,
span.price.amount.final del {
    float: left !important;
    clear: both;
}

    Hope it helps 🙂

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search