Hi Guys

 

I'm working on a website. What I am trying to do is turn a PSD into HTML5 and CSS. To get the Titles & Headings the way I want them .. I am using Font-Face.

 

However when I bolden the weight of the face-font ... it still doesn't show as bold !!

 

I would greatly appreciate some help.

 

Thank You.

I can't see much wrong with this style:-

@font-face {

font-family: ArcherPro-Book;
font-weight: bold;
src: url("../font/ArcherPro-Book.otf") format("opentype");

}

 

except that when I used bold I coded it AFTER the src but I can't believe that that would make a difference.

Does the ArcherPro-Book font allow or have a bold version?

 

It doesn't work in IE because IE needs the font in .eot format which you can add

@font-face {

font-family: ArcherPro-Book;
src: url("../font/ArcherPro-Book.eot");
src: url("../font/ArcherPro-Book.otf") format("opentype");
font-weight: bold;
}

if you can get it in .eot format.

Thanks Wickham

 

Yep I know about the IE, however I'm viewing the site in Chrome.

 

How can I find out if that font allows or has a Bold Version ? Is there a way to find out ? In Photoshop .. it does have a Bold option !

 

Thanks

Hi Guys

 

I'm working on a website. What I am trying to do is turn a PSD into HTML5 and CSS. To get the Titles & Headings the way I want them .. I am using Font-Face.

 

However when I bolden the weight of the face-font ... it still doesn't show as bold !!

 

I would greatly appreciate some help.

 

Thank You.

 

change your font declaration to this

 

@font-face { 
 font-family: ArcherPro-Book;  font-weight: normal;
font-style:normal;
src: url("../font/ArcherPro-Book.otf") format("opentype"); 
} 

 

then alter the weight in your h1 settings

Thanks Pat24

 

That worked but it looks raggedy for some reason !! It doesn't look smooth at all.

 

If no better solution exists .. I think I'll return it to what it was .. but with a bigger font.

change your font declaration to this

 

@font-face { 
 font-family: ArcherPro-Book;  font-weight: normal;
font-style:normal;
src: url("../font/ArcherPro-Book.otf") format("opentype"); 
} 

 

then alter the weight in your h1 settings

 

Yes, that's what I did actually, I've just checked. Normal in the style for the font and bold in h1.

Do you guys not notice how raggedy it is ? or is it just me ! LOL

It's OK for me in 1024*768 resolution in Firefox and Chrome (you've styled it as bolder at the moment).

Don't you think it looks better now ?

It's now 40px without bold, looks a bit thin in Chrome but looks very bold in Firefox. I suppose Firefox is making it thicker in proportion to the height but Chrome isn't so much.

Don't you think it looks better now ?

 

it looks sharp enough

Nice Thanks Guys

 

Very Much Appreciate your Help.

It's directly 40px without boldface, looks a bit dilute in Chrome but looks very bold in Firefox. I suppose Firefox is making it denser in balance to the height but Chrome isn't so much.