Using CSS Calc()to Become the Master of Typography


Gone are the days when typography within a web page meant choosing sans-serif over serif. What used to be done with Adobe Flash can now be done with CSS. Breaking free of the browser’s fonts and being able to use custom fonts freed up web designers to use the subtleties of type design. The CSS calc notation allows the type to fill space the way the designer wished. The measurement units, vw, vh, vmin and vmax, allow the designer to create work that is responsive to the size of the viewport.

The blog, Made By Mike, helps explains how to use the calc notation: Precise Control over Responsive Typography.

See Also

CSS TricksA Couple of Use Cases for Calc()

David WalshDemo: CSS calc

W3C | Calc() Specification

Six RevisionsA Quick Overview of CSS calc()

Can I Use | Support for the calc() notation in browsers



About The Author

Deke departed Southern Alabama as a young man, leaving the humidity and fire ants behind. The fire ants are catching up with him. He works for Adobe. Despite that, his opinions expressed on this site are his own and should never, ever, be attributed or blamed on Adobe. Ask him what he thinks of chiggars sometime. Home Page | GitHub | Adobe Blog | Twitter | LinkedIn