Search code examples
cssfont-face

Word spacing in font-face?

I can't find any documentation for this on the internet. I just put the Bebas font on my page like this:

@font-face {
    font-family: 'BebasRegular';
    src: url('fonts/BEBAS___-webfont.eot');
    src: url('fonts/BEBAS___-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BEBAS___-webfont.woff') format('woff'),
         url('fonts/BEBAS___-webfont.ttf') format('truetype'),
         url('fonts/BEBAS___-webfont.svg#BebasRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

However, the font has too small gaps between words - sometimes it is hard to see where one word stops and the next word begins.

Is it possible to define the width between words in the font-face declaration?

Solution

  • Use the letter-spacing property:

    letter-spacing:2px;