24. fluid font size

  - accepted / - tried

Create a heading of fluid font size.

  1. if viewport width is smaller than 200px, use 16px
  2. if viewport width is bigger than 400px, use 32px
  3. otherwise font-size is linearly scaled. For example if viewport is 300px = (200px + 400px) / 2, then font-size is 24px = (16px + 32px) / 2
<h1 class="title">BFE.dev</h1>

1.100px

2.150px

3.200px

4.219px

5.252px

6.300px

7.379px

8.400px

9.500px

(36)