Last active
February 21, 2017 10:17
-
-
Save AllThingsSmitty/ca2b5f00b430c1926c4cea90c57f7ff7 to your computer and use it in GitHub Desktop.
Use :root for flexible type
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* This has been added to CSS Protips https://github.com/AllThingsSmitty/css-protips */ | |
| /* The type font size in a responsive layout should be able to adjust with each viewport. | |
| You can calculate the font size based on the viewport height and width using :root */ | |
| :root { | |
| font-size: calc(1vw + 1vh + .5vmin); | |
| } | |
| /* Now you can utilize the root em unit based on the value calculated by :root */ | |
| body { | |
| font: 1em/1.6 sans-serif; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@ashikjs I totally forgot to post the link to a demo I did months back. Here it is.