Make narrow characters with CSS

0 votes
asked Jul 21, 2009 by alex

How do I reduce characters' width of Arial-like fonts with CSS?

5 Answers

0 votes
answered Jan 21, 2009 by gumbo

Streching a font will be possible with the font-stretch property of CSS 3.

0 votes
answered Jul 21, 2009 by mike-robinson

You can't reduce character width, but you can reduce letter-spacing.

span {
 letter-spacing: 0px;
0 votes
answered Jan 16, 2011 by mm

Use narrow fonts in your font-family declaration. These are pretty common.

font-family: "Helvetica Narrow","Arial Narrow",Tahoma,Arial,Helvetica,sans-serif;

0 votes
answered Jan 10, 2015 by zero

you can use font-weight: in your css code for this

0 votes
answered Jan 19, 2016 by javarome

You can just scale your text. For instance:

.my-text {
    transform: scaleX(0.5);

but beware of transform-origin which can make your text move elsewhere (for example if you scale it with an origin at its center).

Welcome to Q&A, where you can ask questions and receive answers from other members of the community.
Website Online Counter