`font-size` With All Viewport Units

We've covered fluid type a number of times. This page probably covers it in the best detail. It's a little more complicated than simply using a vw unit to set the font-size since that's far too dramatic. Ideally, the font-size is literally fluid between minimum and maximum values.

Someday there will be min-font-size and max-font-size (probably), but until then, our fluid type implementations will probably need to resort to some @media queries to lock those mins/maxes.

Or...

Around a year ago Matt Smith documented a technique I had missed. It calculates font-size using a little bit of vw, a little bit of vh, and a little bit of the smaller of the two...

:root {
  font-size: calc(1vw + 1vh + .5vmin);
}

Of course, it depends on the font and what you are doing with it, but it seems to me this tempers the curve such that you might not really need a min and max.

Direct Link to Article — Permalink

---

`font-size` With All Viewport Units is a post from CSS-Tricks

from CSS-Tricks http://ift.tt/2gYcZjJ
via IFTTT