nathanford/min-max-font-size

Using vw or vh CSS units? Set a min or max font-size for your type.

min-max-font-size's Issues

Not working with scss - Uncaught TypeError: Cannot read property 'innerHTML' of undefined

Trying to use this in a Jekyll project, after including the script I am getting this error:

Are there any extra steps that need to be taken to ensure this is working when using in conjunction with sass or scss?

Issue During Button

While i am applying min-font-size or max-font size to button it doesn't work.

Uncaught TypeError: Cannot read property 'match' of undefined

I just included the script and get this error. http://new.gruene-neun.de/
Did i something wrong or is there an error in the script?

Thanks!

Doesn't work with media querries

I thought to remove the ugly lage font size jump during load I could use a media query to only trigger under a certain size, but kills the JS

How to use when CSS is generated by javascript?

I can't seem to get this polyfill to work. I have to generate the CSS styling after the initial page is loaded (e.g. using something which essentially boils down to document.styleSheets[0].insertRule("test { min-font-size: 44px }").

The instructions say to put the script at the end of the body, which makes me think this is important and why it isn't working, because I don't actually have any CSS when the page is first loaded - everything is generated dynamically using javascript (both HTML elements and the accompanying CSS).

Is there some way to get this polyfill to work for this use case?

Uncaught SyntaxError: Failed to execute 'querySelectorAll' on 'Document'

At init() I get:

Uncaught SyntaxError: Failed to execute 'querySelectorAll' on 'Document': '*/

.fc-Bookmark' is not a valid selector.

at line 234:

   var eles = document.querySelectorAll(selector)

because in a CSS file I have something like:

/.fc-BookmarkContainer{/
/width:85%;/
/height: 15%;/
/min-height: 42px;/
/max-height: 90px;/
/}/

.fc-Bookmark{
...
}

I solved it by removing the commented block ('.fc-BookmarkContainer') from the CSS file.

Uncaught TypeError: Cannot read property 'innerHTML' of undefined

Got this error after implementation.

Typeerror

Using latest safari on mac

Sometimes Does not Apply or Can see font before loaded

Sometimes if you refresh in Chrome it does not end up downsizing the font like it should, but this doesn't seem to happen when you navigate to the page from another page.

Also sometimes you can see the font jump from large to downsized - right now I'm trying to play with fading the font in or showing it, once MM has been applied.

Could be possible it's loading before the DOM is fully ready?

edit: typo.minMaxFontSize(rule.selector); does not get fired when it doesn't work.

Not Working At All

This is probably me being an idiot somewhere but this script doesn't work for me at all. Just trying out the demo file on latest versions of FF, Safari and Chrome all result in the max-font-size rule being ignored.

Uncaught TypeError: Cannot read property 'style' of null

Error on Google Chrome 49.0.2601.0 canary (64-bit)

Error on Firefox 43.0.3

I'm using the script in a Drupal theme (by loading on the theme_name.info file) that includes it in the html head.
Probably it should only run after the page is loaded.

I've tried to comment the stylefill.init in the mm-fontsize.js and call it on window.onload, and the error was gone but there were no visible effects (the new css rules were not being applied)

Uncaught TypeError: Cannot read property 'innerHTML' of undefined

Got this error after implementation.