Search code examples
cssfont-face

Can browsers resolve font-face conflicts

My site uses some fonts with the @font-face CSS tag.

However I'm trying to add some temporary CSS styling to my site for a holiday or season...

I'd like to change an accent font to a different font. I was wondering if it was possible to leave the original CSS and just let my seasons.css file override it. Can browsers resolve @font-face conflicts?

My original CSS would be like:

@font-face {
Font-family: 'accentfont2';
Src: url(example/font.ttf);
}

And then my seasonal CSS which will be positioned below the standard CSS will be like:

@font-face {
Font-family: 'accentfont2';
src: url(example/seasonalfont.ttf);
}

Would the browser resolve the conflict by using the seasonalfont.ttf rather than the font.ttf?

Solution

  • They can... all I had to do was type the normal CSS and it worked. This question was looking for a recommendation/condemnation but whatever