FlowType not working with pixels? What am I missing?

[alvarotrigo]

As there are no examples available to download to compare with, I'm not quite sure what I'm missing. It would be a good idea to have a folder with examples. There's not even a fiddle or a codepen of its usage on the docs...

Here's a reproduction of what I'm trying to do. I can see the font-size inline attribute being applied to the parent, but it doesn't seem to have any effect on the child elements.

It seems it only works when applying em instead of px to the element i want to make resizable. Nothing is mentioned in the docs about having to use em instead of pixels. So not sure if this is a must or not...

Here's the same version but working as expected when using em units instead.

I've seen some other demos which doesn't seem to be working either.

What am I missing?

[jdgraffam]

You need to include FlowType.js in your JSFiddle.

[alvarotrigo]

@jdgraffam it is there. Take a look at the left panel under the External Resources section.

[jdgraffam]

Sorry, duh. Try this: http://jsfiddle.net/b51h4wcc/

Don't declare font-size on the h2.

[alvarotrigo]

Then I assume these lines in the Set Typography Base section of the docs are not correct when dealing with px, right?

body {
   font-size: 18px;
}

h1,h2,h3,h4,h5,h6,p {
   line-height: 1.45;
}

h1 { font-size: 4em; }
h2 { font-size: 3em; }
h3 { etc...