The CSS Font-Stretch Property

How to make a CSS font stretch?

By using the CSS font-stretch property, you can define whether you want your font to be wider or narrower:

div {
    font-stretch: condensed;
}

Theory is great, but we recommend digging deeper!

Learn Web Design: The Ultimate Guide For Beginners

LearnToProgram

2.2 (979)

Syntax and property values

The CSS font-stretch property only requires defining one value:

font-stretch: value;

In the table below, you can find all the keywords you can use as values for a CSS font stretch.

Browser support

Chrome

60+

Edge

12+

Firefox

9+

IE

9+

Opera

47+

Safari

11+

Mobile browser support

Chrome

60+

Firefox

9+

Opera

44+

Safari

11+