Stylesheet variables


I would like to edit the CSS for a class in the less stylesheet. So if there a way to do it. Something like

less file:

.tag {
   color: red;

Now in the package,
add “width:100px:” to tag.

I know this can be done with .css function, but i want to edit the pseudo element, so this is not possible


I’m not sure what you’re asking here. Can you be a little more explicit?


I just want to edit the class or css information in the less file on the run. I need this solution because i would like to add some css information for the pseudo elements, which is not possible by using the css function of jquery


Wouldn’t one normally just change the class of or add a class to the element that has the additional style information?

For example, I have the following HTML:

<div class="tag">
My stuff

And I have the following CSS:

.tag {
  color: red;

And I want to make the div 100% width, as you said. I could add this to the CSS:

.full-width {
  width: 100%;

And then use jQuery to add the full-width class to the div. That way you don’t have to change the contents of a class on the fly, you just make composable classes.


That is true, Let me tell how i am using, I have a column whose width changes at run time, i use this value to be set on the pseudo element,

 .classname:after {
     width: some value;

So i wanted to know of some way to do this. So here i am adding content to the class dynamically. You can add the class using jquery, but the problem is how to create that class dynamically.


I suppose you could manually create a <style> element and add that to the DOM somewhere. But I’m not an HTML and CSS expert.