More robust florin, without negative margin

Florin was introduced because the Times New Roman italic f extends
weirdly far on either side, whereas the Times New Roman italic florin
symbol is much more...reserved. Or something. I dunno, it looks bad.
Anyway, the thing with florin is it has tons of spacing on either side
for whatever reason, so we use a negative margin to get it to overlap
normally with adjacent characters.

Which seems pretty natural, but unfortunately keeps causing problems
(#61, #90, now #295):
https://github.com/mathquill/mathquill/issues?labels=Florin&state=closed

I suspect that negative margins on inline elements is uncommon, I don't
think the box model is really meant for inline elements, width and
height are even ignored on them. Instead, an inline-block with a fixed
width narrower than the florin symbol (the whole symbol is still visible
because it defaults overflow:visible) and position:relative (to overlap
on both sides, not just the right side) seems less likely to cause
layout quirks. Or at least, unique layout quirks, inline-blocks cause
tons of layout quirks but MathQuill already works around them because
almost everything besides letters and digits are inline-blocks, and
position:relative basically doesn't affect layout.
Merge pull request #296 from mathquill/fix.florin

More robust florin, without negative margin