Option to override "!important"

[yoannisj]

Sometimes you may want to override css "!important" font-size rules. This can be done by replacing the resizer function by the following :

var resizer = function () {
      var fontSize = Math.max(Math.min($this.width() / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize));
      $this.attr('style', 'font-size: ' + fontSize + 'px !important');
};

The reason I wanted to do this is because I use a utility class to set fallback font-sizes, and, being part of a css framework, that utility class needs the !important flag.

http://css-tricks.com/when-using-important-is-the-right-choice/

There are probably some other use cases but I think it would be best to implement it as an option though.

[davatron5000]

Hrmmm... This is the first time this use case has come up. I think it's maybe unique to your situation where you want to use those utility classes with the !important flag. !important generally means "f&$%ing do this", so if an inline style from FitText can't style it, we probably want to yield. We could add an option, but the use case might be too small to justify it.

Because it's specific to your situation, I think you should just modify your version of FitText and use that. If this issue keeps cropping up, we'll reconsider adding an option.

[Drethic]

I ran into this exact situation and came up with almost the same fix as @yoannisj. Given that I'm building this into a WordPress plugin that can be used on various sites with many possible theme setups the option to override with important wouldn't be a bad thing and could be optional by adding a third option into the settings and if that's set use the .attr vs .css.