Stylesheet variables


#1

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


#2

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


#3

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


#4

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
</div>

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.


#5

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.


#6

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.