Fork me on GitHub

ng-fi-text makes any text fits any box of any size in any (angular) website.

What's ng-fi-text and what it does?

What basically does is to tweak the font-size to the maximum size possible that fits its container (a <div> that has the ng-fi-text attribute added).

ng-fi-text is an angular.js directive currently. I have plans to wrap the source into a custom binding for knockout.js, as jQuery plugin and so on.

This work is derived from a knockout.js's custom binding I made when coding witzum.com.

Does it work with long text?

Yes. Example:

Editable input for the example
Your good old div
The same div with ng-fi-text added

What about html? Can be used inside it?

You bet. Example:

Editable input for the example
Normal div ( overflow-y: scroll )
Same div with ng-fi-text & ng-fi-text-html added

Is it responsive?

Yup. It auto refreshes on window resize event. You can try to resize this window to see it in action.

Dependencies?

  • Angular.js

  • jQuery ( planning to eliminate this dependency on next releases )

How can I use it?

Go to the Github page, the README you'll find there is like a Owner's Manual, with installation and setup indications.

https://github.com/leandropio/ng-fi-text

How much is it?

For you, nothing, ng-fi-text has the MIT license which gives you permission for doing whatever you want to do with the code for free.