skip to Main Content

I have a WooCommerce website on which

I have added a bit of custom CSS code.
I want a line break after the 1st "€" character.

Unfortunately, the class for taxes is called the same and

therefore a line break is also inserted at the "€" symbol for taxes ("MwSt.").

How can I get a line break only after the 1st € symbol.

The result should look like this:

13,90 €
(incl. 2.22 € MwSt.)

And not like this:

13,90 €
(incl. 2,22 € 
MwSt.)

In addition here are some screenshots:

Result

Chrome Inspector

CSS Code

Screenshot cart page

2

Answers


  1. The woo-commerce plugin has an option to put a space between price and currency, it can be found here:

    woo-commerce << Settings

    wordpress user interface with option highlighted

    Login or Signup to reply.
  2. You need to target the span and get as specific as you can about it:

    woocommerce-Price-amount.amount bdi span.woocommerce-Price-currencySymbol::after{
      content: 'A ';
      white-space: pre;
    }
    

    Not an absolute guarantee that this is enough because there may be other instances which you don’t want changed, but we don’t have enough info to check.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search