Container Queries and Fluid Typography

Let’s continue with our card example for a little longer. We can extend it by introducing container-based fluid typography.

Fluid typography

Fluid typography involves the use of the clamp() function, which allows us to define three values to create a range of accepted sizes. The middle, ideal value needs to be dynamic to cause a change between the low and high ends of the range.

Previously, we might have tried the technique of including the vw (viewport width) unit, such as: