Jump to content

XML, CSS and @font-face


beammedown

Recommended Posts

O.K. First the scenario....I am working on a flash website where I am pulling the content for each page thru the load function and using XML data files so that the customer can edit them at a later date if they so please. The customer also asked for some fancy non-standard font to be used throughout the flash and some of the XML content. SO I think fine.. since I'm formatting the XML output with CSS I can use @font-face and include the custom font! Woo!Or can I?As soon as I added the @font-face declaration, I lost the rest of the formatting. ?????????? I think.. hmm must be a code error... I check all the code again.. no dice.. no errors.. nothing.The declaration works in HTML file I made quickly for testing. Hmmmmm...So.. I decide to test.. just one line of the @font-face and use the .ttf extension to test in my FireFox...I get the rest of the styling.. but .. still no special font.I used font squirrel to get the other formats..but I uploaded the original .ttf file to test with as well... so no corruption problems etc.Tried changing the font name and file to lowercase one word to rule out the file names being a problem.So here I am. Has anyone tried to use @font-face in a CSS sheet that is styling XML?Is it even possible?Thanks in advance to anyone giving insight :)Code Bits

@font-face { 	   font-family: 'customfontname';	   src: url('fontlocation/fontname.ttf');}

Implementation of said @font-face declaration

.title {	font-family: customfontname, Trebuchet MS, Tahoma, Verdana;	font-size: 36px;	color: #FFCCCC;}

Link to comment
Share on other sites

Does it work for HTML styled pages? Support for ttf fonts has only been available in IE since IE9. I've heard little about using CSS over XML, probably because few people actually use that. The more typical scenario is to use XSLT to convert the XML into XHTML and style THAT.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...