CSS FOR setting CONTENT OF LABEL

Mark Tabor

4y1kWeb Development

I want to change the label from Price to Total Price ,What would be the css

Price *

9 Replies

Know the answer? Post it — somebody with the same question will find it here.

Sachin Singh4y ago
I don't think there is any CSS selector with which you can find the previous element.
Your label control comes before the input element (ad_price).

for example, you can apply CSS if label was after your input element
#ad_price +label
{
//css code
}
Note:- I haven't read the documentation for the latest CSS3 , if you can find any such selector.
Mark Tabor4y ago
This css works but it change all labels

label.price-label:after {
content:'Total Price';
}
Mark Tabor4y ago
sachine you can see it has id element , basically its wordpress i can only modify using css.
name="ad_price" id="ad_price" data-parsley-required="true" data-parsley-pattern="/^[0-9]+\.?[0-9]*$/" data-parsley-error-message="only numbers allowed." value="" data-parsley-id="17">
Sachin Singh4y ago
With CSS it is a little complicated as you don't have any specific class.
Better if you can use jquery
$(function(){
$("label").text($("label").text().replace("Price", "Total Price"));
})
Mark Tabor4y ago
i cannot change the source code can only modify with this current structure using css
Uttam Kumar4y ago
You add a new class for the price label
<label class="control-label price-label">Price <span class="required">*span>label>

label.price-label:after {
  content:'Total Price';
}
Mark Tabor4y ago
Your provided Css change all labels on the page
Mark Tabor4y ago
Dear the issue is i need to do it via css due to wordpress theme
Uttam Kumar4y ago
It is not recommended to change the text using CSS instead of CSS I would suggest you use Javascript or jQuery.

You can see this link, It'll help you
https://stackoverflow.com/questions/7896402/how-can-i-replace-text-with-css
label.control-label:after {
  content:'Total Price';
}