The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Problem with @font-face

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #35774

    I’ve been having some trouble getting the font Chunk to look nice on XP and Vista. It looks great on a Mac and Windows 7. Here is the implementation:

    @font-face {
    font-family: ‘Chunk’;
    src: url(‘fonts/webfonts/Chunkfive-webfont.eot?#iefix’) format(’embedded-opentype’),
    url(‘fonts/webfonts/Chunkfive-webfont.woff’) format(‘woff’),
    url(‘fonts/webfonts/Chunkfive-webfont.ttf’) format(‘truetype’),
    url(‘fonts/webfonts/Chunkfive-webfont.svg#svgFontName’) format(‘svg’);

    .header {
    font-family: ‘Chunk’, Georgia, “Times New Roman”, Times, serif;
    font-size: 30px;
    color: #FFF;
    text-shadow: 2px 2px 3px #000;
    margin: 20px 0 5px 20px;
    padding-bottom: 5px;
    letter-spacing: 2px;
    border-bottom: 1px #FFFFFF solid;
    width: 290px;

    Does anyone see any problems with my implementation? I know the issue with ClearType on older Windows OS not being activated by default. I use a windows xp computer at work and turned ClearType on and Chunk still does not look right. It looks like it bold type with an extra border around it.

    Thanks in advance


    Try adding font-weight: normal; to .header.


    Thank you for the suggestions. I went ahead and downloaded the kit from Font Squirrel and used the CSS directly from that which is:

    @font-face {
    font-family: ‘ChunkFiveRegular’;
    src: url(‘Chunkfive-webfont.eot’);
    src: url(‘Chunkfive-webfont.eot?#iefix’) format(’embedded-opentype’),
    url(‘Chunkfive-webfont.woff’) format(‘woff’),
    url(‘Chunkfive-webfont.ttf’) format(‘truetype’),
    url(‘Chunkfive-webfont.svg#ChunkFiveRegular’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    This seemed to work perfectly.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.