In my current project, I am working with an imported serif font that inherently has an italic skew to it. I would like to set the fallback font to georgia, but I would like to apply the italic version of Georgia as the fallback, rather than it's normal display.
Is there any way I can apply Italics to just one of my fallbacks? or is there a way I can call upon the italic display of Georgia within the css?
(I wish I could be as helpful on the forums as most of you seem to be, but I am still pretty new to all this!)
I am using a font from lost type called pigeon. The font itself, to me at least, looks to be inherently italicized. needless to say, it does bear a similarity to italic Georgia, hence why I would like to set that as the fall back.
I can see what you mean. The only way of doing it that I can think of is using Modernizr. This then detects what browsers do (and don't) support. If it doesn't support @font-face, it applies a class of no-fontface to the html tag. You then target that like so:
The thing is, pretty much all browsers (except really ancient ones) support @font-face, even IE6 supports it as far as I am aware (I have no way of testing).
I KNOW that IE7, 8, 9 and 10 support it. Gecko, Opera and Webkit browsers do too.
If his web served font isn't loaded (for whatever reason..perhaps the font-repository is down) then he want's an italic fallback that's available locally
Hmm you could have a JS function that checks to see what the body font-family is, and if it is currently Georgia add a CSS value to the body to make it italicized. But I wouldn't want to do that, unless it is extremely important that everyone sees italic text.
Yeah...but my point was (& perhaps I'm missing something) is that Georgia Italic would have to be installed...and (happy to be wrong) but that's not a standard font..or is it?
Or would it take a standard Georgia and italicize it?
You can add multiple local sources to one font-face declaration. I updated the pen to show that. It doesn't take standard Georgia and italicize it. Quite annoying. One would assume though, that if the user has Georgia installed, they also have Georgia Italic. I am using Windows and Mac right now and both have Georgia pre-installed.
OK, so I got home and had a chance to test this further on my MacBook. It only works in Firefox. The other browsers just display the non-italicised version. Damn, I thought we had it. Anyway if that is not a huge issue for you, then you are welcome. Haha.
In my current project, I am working with an imported serif font that inherently has an italic skew to it. I would like to set the fallback font to georgia, but I would like to apply the italic version of Georgia as the fallback, rather than it's normal display.
Is there any way I can apply Italics to just one of my fallbacks? or is there a way I can call upon the italic display of Georgia within the css?
(I wish I could be as helpful on the forums as most of you seem to be, but I am still pretty new to all this!)
What is the font that you are using that is italic?
I am using a font from lost type called pigeon. The font itself, to me at least, looks to be inherently italicized. needless to say, it does bear a similarity to italic Georgia, hence why I would like to set that as the fall back.
I can't see any way of doing this (other than using a Georgia Italic font).
I suppose it might be possible to do something with JS though.
I can see what you mean. The only way of doing it that I can think of is using Modernizr. This then detects what browsers do (and don't) support. If it doesn't support @font-face, it applies a class of no-fontface to the html tag. You then target that like so:
The thing is, pretty much all browsers (except really ancient ones) support @font-face, even IE6 supports it as far as I am aware (I have no way of testing).
I KNOW that IE7, 8, 9 and 10 support it. Gecko, Opera and Webkit browsers do too.
Yeah...but that's not the issue..or is it?
If his web served font isn't loaded (for whatever reason..perhaps the font-repository is down) then he want's an italic fallback that's available locally
Actually it doesn't resemble Georgia that well.
There is a way to do what you're asking with CSS but I can't find the post in the forum.
Hmm you could have a JS function that checks to see what the body font-family is, and if it is currently Georgia add a CSS value to the body to make it italicized. But I wouldn't want to do that, unless it is extremely important that everyone sees italic text.
I FOUND IT
And to prove it
@alexmccabe Assuming he owns/licenced "Georgia Italic" :)
Paulie_D, it takes the local copy stored on the users machine.
Yeah...but my point was (& perhaps I'm missing something) is that Georgia Italic would have to be installed...and (happy to be wrong) but that's not a standard font..or is it?
Or would it take a standard Georgia and italicize it?
Update: On my computer it's "Georgia Italic" (with spaces).
@Pauly_D Georgia has italics and it is on both Windows and Mac.
You can add multiple local sources to one font-face declaration. I updated the pen to show that. It doesn't take standard Georgia and italicize it. Quite annoying. One would assume though, that if the user has Georgia installed, they also have Georgia Italic. I am using Windows and Mac right now and both have Georgia pre-installed.
On my standard install W7 machine...I only have Georgia and not GI is not listed as a 'separate' font.
However, of course, the trick would be to specific a 'standard' italic font that resembles the chosen font as closely as possible.
Solved...ish. :)
How odd, my W7 machine has Georgia Italic already. I checked to make sure and it was added in 2009, that pre-dates this machine by three years.
If it is part of the font 'stack' installed on your machine, it should work, as that is how mine is displayed too.
OK I thought I had found the solution, but apparently not. Back to the drawing board. =[
@Paulie_D
Go to Computer > C: > Windows > Fonts > Georgia > You will see the list that includes Italic
Screenshot
So it does....the things you learn everyday.
:)
So have I solved this? Because my W7 and W8 machines have Georgia Italic as 'Georgia Italic' and my MacBook has it under 'GeorgiaItalic'.
A quick look, XP has it pre-installed too as Georgia Italic.
@alexmccabe No. You need to use the following CSS for it to work
@chrisburton I tried that on my machine and it doesn't work without declaring it as font-face. This pen works though
@alexmccabe Not for me it doesn't. However, if you set the font-style to normal, it does. You could probably just remove it altogether
@chrisburton, what OS are you using?
I guess you could combine both. So the font stack could look like this;
W7
@christburton Does it work now?
@alexmccabe It works.
It has worked for me as well. Thank you so much to everyone who helped solve this!
OK, so I got home and had a chance to test this further on my MacBook. It only works in Firefox. The other browsers just display the non-italicised version. Damn, I thought we had it. Anyway if that is not a huge issue for you, then you are welcome. Haha.