I have a problem with this css in an online-shop. It is a cloud shop so I can't change the files only the CSS.

Is there a way to change the 4.799 Text to red? There must be some kind of a function to change everything but the "productOldPrice"-child. Any idea? Thanks.

<span class="current-price-container" title="Product-Title"> 
<span class="productOldPrice">UVP 4.900,00 EUR</span>
<br>
Nur 4.799,00 EUR</span>

CodePudding user response：

.current-price-container{
    color:red;
}
.productOldPrice{
    color:grey;
}

CodePudding user response：

Since you want to change the text color of the parent span, then you can change the parent's text color to red, then give the child span the default color.

.current-price-container { color: red }
.productOldPrice { color: #000 }

<span class="current-price-container" title="Product-Title"> 
<span class="productOldPrice">UVP 4.900,00 EUR</span>
<br>
Nur 4.799,00 EUR</span>

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response：

yes you can do it :)

.current-price-container  {color:red}
.productOldPrice{color:black}

<span class="current-price-container" title="Product-Title"> 
<span class="productOldPrice">UVP 4.900,00 EUR</span>
<br>
Nur 4.799,00 EUR</span>

<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response：

You could do it using the :not pseudo selector, which might suit your logic of "...everything but (x)".

.current-price-container .productOldPrice {
        color: black;
    }

.current-price-container:not(.productOldPrice) {
    color: red;
}

CodePudding user response：

Well, what i am wondering is that is the solution that asker needs only supposed to change the 4799 not the whole text?

From my point of view, in that case the answer is supposed to be NULL.

If not, others have answered your question.