WordPress.org

Ready to get started?Download WordPress

Forums

Problems with @font-face (5 posts)

  1. Aldarabd
    Member
    Posted 1 year ago #

    Hi!
    I have wordpress installed locally and I am working in the css theme.
    I would like to have a very thin font in the header but when I make the font-size bigger it also gets bolder (much much bolder than in photoshop at the same size).

    I tried to change the font-weight but doesn't work. The code is

    #header {
    	background: #fff;
    	color:#d51966;
    	font-size:4em;
    	padding: 30px 5px 40px 5px;
    	font-family: 'josefin_sans', sans-serif;

    I use @font-face to personalized the font.

    @font-face {
        font-family: 'josefin_sans';
        src: url('fonts/josefinsansstd-light-webfont.eot');
        src: url('fonts/josefinsansstd-light-webfont.eot?#iefix') format('embedded-opentype'),
             url('fonts/josefinsansstd-light-webfont.woff') format('woff'),
             url('fonts/josefinsansstd-light-webfont.ttf') format('truetype'),
             url('fonts/josefinsansstd-light-webfont.svg#josefin_sans_stdlight') format('svg');
    }

    Hope any of you help me!
    Thanks, Aldara.

  2. esmi
    Forum Moderator
    Posted 1 year ago #

    There's no real answer to this. Most fonts become slightly bolder as they are enlarged. Perhaps you just need to look for another font?.

  3. Aldarabd
    Member
    Posted 1 year ago #

    Hi!
    Well it doesn't become slightly bolder, it gets much, much, much bolder :( than in photoshop and this is the third font I tried!
    This is very weird, it is the first time this happens to me.
    Thank your for your quick answer!

  4. Andrew
    Forum Moderator
    Posted 1 year ago #

    Can you post here a screenshot of the boldness issue and say which font size it is?

    Then we can compare to the font's demonstration page as to whether it's an issue with the font itself.

  5. esmi
    Forum Moderator
    Posted 1 year ago #

    A link to the actual page where this "bolding" is happening might also be helpful - just in case you've missed another bit of CSS that's causing the problem.

Topic Closed

This topic has been closed to new replies.

About this Topic