TwitterBootstrap + mvc how to skip dynamic width to increase inactivity class

Question

I am using TwitterBootstrap and I want to pass the dynamic width of the button .. as below code

I want to pass the "@wth" value Dynamically on the client side (from the view (MVC)). Right now it is approaching Static to the varibles.less file .... But I want to go directly from the view (MVC).

So what is the best solution?

Answer 1

Although it seems that you can do dynamic things if you use less.js in a browser, these styles are all compiled into CSS files and have fixed values ​​by the time they are applied to your html. Therefore, you cannot change the values ​​of smaller variables after loading the page .

If you need to dynamically change the width of a button based on several predefined sizes, I would say that you should add classes to your css (small, medium, large, etc.) and then dynamically add this class to your CSS using JQuery addClass .

If you need to set the width directly, I would use the jQuery css method.

If you intend to do a lot of this, you may need to use a data binding library that can bind a Javascript object to your html styles, like Knockout .