Fri, 2011-08-19 01:29
Hi, everyone. I have a website at http://silencepress.info and I have trouble with Firefox compatibility regarding embedded fonts. I used fontsquirrel to make an @font-face stylesheet and linked said stylesheet in the code. It works fine on IE and Chrome, but Firefox does not want to render the fonts.
Any help is greatly appreciate, thank you very much.
Here is the web code (note: it is a tumblr theme)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>silencePRESS{block:PostTitle} - {PostTitle}{/block:PostTitle}</title> {block:Description}<meta name="description" content="{MetaDescription}" /> <!-- .d8888b. 8888888 888 8888888888 888b "Y888 .d8888b. 8888888888 d88P Y88b " 888 " 888 888 Y 8888b 888 d88P` "Y8b 888 Y Y88b. 888 888 888 ,A 88888b 888 888 `88 888 ,A .888888P" "Y888b. 888 888 8888888 888Y88b 888 888 8888888 ,d888888Y "Y88b. 888 888 888 "Y 888 Y88b888 888 888 "Y "888 888 888 A 888 A 888 Y88888 888 .88 888 A Y88b d88P , 888 , 888 d8 888 d8 888 Y8888 Y88b_ ,d8P 888 d8 "Y8888P" 8888888 88888888 8888888888 888b, Y888 "Y8888P" 8888888888 --> {/block:Description} <style> strong.c6 {font-weight: 1000;} p.c4 {text-align: right} </style> <link rel="stylesheet" type="text/css" href="http://static.tumblr.com/vyfkgek/tBYlpvpmr/c39hrp48dhtt.css"> <link rel="stylesheet" type="text/css" href="http://static.tumblr.com/vyfkgek/B3Ulpwgam/algresansncregular.css"> <link rel="stylesheet" type="text/css" href="http://static.tumblr.com/vyfkgek/bdMlpxdf8/kingregular.css"> <style type="text/css"> body { font-size: 12px; background: url('http://static.tumblr.com/vyfkgek/sAHlpsj4f/bare_trees_2.jpg') left bottom fixed repeat-x; line-height: 1.2em; color: #fff; font-family: Verdana; overflow-x: hidden; } img.blog { max-width: 500px; width: expression(this.width > 500 ? 500: true); } img.photo { -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; margin:auto; } a img.photo { width: 500px; opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); -moz-transition-property: opacity; -moz-transition-duration: 0.25s; -webkit-transition-property: opacity; -webkit-transition-duration: 0.25s; -o-transition-property: opacity; -o-transition-duration: 0.25s; transition-property: opacity; transition-duration: 0.25s; } a img.photo:hover { border: 0px; opacity: 0.5; -moz-opacity: 0.5; filter: alpha(opacity=50); } a img.photo:active { border: 0px; opacity: 0.75; -moz-opacity: 0.75; filter: alpha(opacity=75); } a, a:link, a:visited { text-decoration: none; color: #aaa; -moz-transition-property: color; -moz-transition-duration: 0.25s; -webkit-transition-property: color; -webkit-transition-duration: 0.25s; -o-transition-property: color; -o-transition-duration: 0.25s; transition-property: color; transition-duration: 0.25s; } a:hover { color: #fff; text-shadow: 1px 1px 3px #000; } a:active { color: #fff; text-shadow: -1px -1px 3px #000; } a.nav, a.nav:link, a.nav:visited { padding: 2px; text-decoration: none; color: #fff; -moz-transition-property: color; -moz-transition-duration: 0.25s; -webkit-transition-property: color; -webkit-transition-duration: 0.25s; -o-transition-property: color; -o-transition-duration: 0.25s; transition-property: color; transition-duration: 0.25s; } a.nav:hover { background-color: #fff; color: #000; text-shadow: 1px 1px 3px #000 ; } a.nav:active { color: #000; text-shadow: -1px -1px 3px #000; } a.permalink, a.permalink:link, a.permalink:visited { text-decoration: none; color: #FFE0B5; -moz-transition-property: color; -moz-transition-duration: 0.25s; -webkit-transition-property: color; -webkit-transition-duration: 0.25s; -o-transition-property: color; -o-transition-duration: 0.25s; transition-property: color; transition-duration: 0.25s; } a.permalink:hover { background-color: #FFE0B5; color: #000; text-shadow: 0px 0px 0px #000; } a.permalink:active { color: #000; } blockquote { margin: 0.5em 0 0.5em 10px; padding-left: 10px; border-left: 2px solid #fff; } p.c2 { color: #222; font-weight: bold; text-align: center; } h1 { font-family:AlgreSansNCRegular; line-height: 1.2em; font-weight:normal; font-size:50px;} h1 a, h1 a:link, h1 a:visited { color:#fff; text-decoration: underline; } h1 a:hover { color:#000; background-color:#fff; } h4 { letter-spacing: 1px; text-transform: uppercase; } p.reblog { margin-bottom: 0em; } table { border-collapse: collapse; } table.content { width: 800px; overflow: visible; } td.posts { width:500px; padding:20px; background:#000; } #postid { margin:10px; font-family: 'C39HrP48DhTtNormal'; font-size: 50px; color: #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; padding-left: 10px; padding-right: 5px; display: inline-block; float:left; height: 60px; background: url('http://static.tumblr.com/vyfkgek/ffHlpwmn5/postidy.jpg'); vertical-align: text-bottom; -moz-transition-property: background; -moz-transition-duration: 0.25s; -webkit-transition-property: background; -webkit-transition-duration: 0.25s; -o-transition-property: background; -o-transition-duration: 0.25s; transition-property: background; transition-duration: 0.25s; -moz-box-shadow: 0px 0px 10px #000; -webkit-box-shadow: 0px 0px 10px #000; box-shadow: 0px 0px 10px #000; } a #postid:hover { -moz-box-shadow: 0px 0px 10px #fff; -webkit-box-shadow: 0px 0px 10px #fff; box-shadow: 0px 0px 10px #fff; } a #postid:active { background: url('http://static.tumblr.com/vyfkgek/bA2lpwme9/postidx.jpg'); -moz-box-shadow: 0px 0px 10px #000; -webkit-box-shadow: 0px 0px 10px #000; box-shadow: 0px 0px 10px #000; color: #fff; } div.info { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; height:80px; font-family:'KingRegular'; font-size:13px; background: url('http://static.tumblr.com/vyfkgek/rGGlpxeoo/papertexdark.jpg'); } td.chatlabel { padding-right: 10px; text-align:right; } {CustomCSS} </style> <SCRIPT LANGUAGE="JavaScript"> image1 = new Image(); image1.src = "http://static.tumblr.com/vyfkgek/b30lpxglm/videoshover.jpg"; </script> </head> <body> <table class="content" border="0" align="center"> <tr> <td colspan="3" bgcolor="#000"> <p align="center"><a href="/"><img src="http://static.tumblr.com/vyfkgek/K3Zlpskbb/header.jpg" alt="{Title}" /></a></p> </td> </tr> <tr> <td bgcolor="#000" colspan="3"> <p class="c2">|<a class="nav" href="/">HOME</a>|{block:HasPages}{block:Pages}<a class="nav" href="{URL}">{Label}</a>|{/block:Pages}{/block:HasPages}<a class="nav" href="/ask">ASK</a>|<a class="nav" href="/submit">SUBMIT</a>|</p><img src="http://static.tumblr.com/vyfkgek/JCulq1vhe/break3.jpg" alt="image" /> </td> </tr> <tr> <td valign="top" width="150" bgcolor="#090701"><img src="http://static.tumblr.com/vyfkgek/TUZlpsm1a/tshirtscomingsoon.jpg" alt="image" /><br><a href="http://www.youtube.com/blackasphyxia0" onmouseover="image1.src='http://static.tumblr.com/vyfkgek/b30lpxglm/videoshover.jpg';" onmouseout="image1.src='http://static.tumblr.com/vyfkgek/TUslpxggq/videos.jpg';"> <img name="image1" src="http://static.tumblr.com/vyfkgek/TUslpxggq/videos.jpg" border=0></a></td> <td class="posts"> {block:TagPage}{/block:TagPage} {block:Posts} {block:Text} <div class="text"> {block:Title} <h1>{Title}</h1>{/block:Title} {Body} </div>{/block:Text} {block:Photo} {LinkOpenTag} <img class="photo" src="{PhotoURL-500}" alt="{PhotoAlt}" /> {LinkCloseTag} {block:Caption}{Caption}{/block:Caption}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}<br /> {/block:Photo} {block:Photoset} <div class="photoset"> {Photoset-500}{block:Caption}{Caption}{/block:Caption} </div>{/block:Photoset} {block:Quote} <div class="quote"> <h3>"{Quote}"</h3> <hr /> {block:Source} <p class="c4">- {Source}</p>{/block:Source} </div>{/block:Quote} {block:Link} <div class="link"> <h1><a href="{URL}" class="link">{Name}</a></h1>{block:Description}{Description}{/block:Description} </div>{/block:Link} {block:Chat} <div class="chat"> {block:Title}<h1>{Title}</h1>{/block:Title} <table class="chat"> {block:Lines}<tr> {block:Label}<td class="chatlabel">{Label}</td>{/block:Label} <td class="line">{Line}</td> </tr>{/block:Lines} </table> </div>{/block:Chat} {block:Audio} <div class="audio"> {block:AlbumArt} <p class="c1"><a class="permalink" href="{Permalink}"><img border="0" src="{AlbumArtUrl}" width="200px" height="200px" alt="image" /></a></p>{/block:AlbumArt}<br /> <p class="c1">{AudioPlayerBlack}</p>{block:Caption}{Caption}{/block:Caption} </div>{/block:Audio} {block:Video} <div class="video"> {Video-500}<br /> {block:Caption}{Caption}{/block:Caption} </div>{/block:Video} {block:Answer} <div class="answer"> <p>{Asker} asked:<br /> <strong class="c6">{Question}</strong></p>{Answer} </div>{/block:Answer} <br>{block:IndexPage}<div class="info"><a href="{Permalink}"><div id="postid"> {PostID}</div></a><table height="60"><tr><td>{block:RebloggedFrom}Reblogged from: <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}</td></tr>{block:Source}<tr><td>Source: {Source}</td></tr>{/block:Source}<tr><td>Posted on {MonthNumberWithZero}/{DayOfMonthWithZero}/{Year} {12Hour}:{Minutes}:{Seconds} {CapitalAmPm}</td></tr></table> </div>{/block:IndexPage} {block:PermalinkPage}{block:Date} <div id="postinfo"> {block:Text}Text {/block:Text} {block:Photo}Photo {/block:Photo} {block:Photoset}Photoset {/block:Photoset} {block:Video}Video {/block:Video} {block:Audio}Audio {/block:Audio} {block:Link}Link {/block:Link} {block:Quote}Quote {/block:Quote} {block:Chat}Conversation {/block:Chat} {block:Answer}Response {/block:Answer} posted {TimeAgo}{block:NoteCount} with {NoteCountWithLabel}{/block:NoteCount} {block:Audio} and {PlayCountWithLabel}{/block:Audio}<br /> </div>{/block:Date} {/block:PermalinkPage} {block:PostNotes} <div id="notes"> {PostNotes} </div>{/block:PostNotes} <img style="margin-bottom:10px;" src="http://static.tumblr.com/vyfkgek/eN7lpvtmj/separator4.jpg" alt="image" /><br /> {/block:Posts} {block:Pagination} <p class="c2">{block:PreviousPage} <a class="nav" href="{PreviousPage}"><big>PREVIOUS</big></a>|{/block:PreviousPage} {block:NextPage} <a class="nav" href="{NextPage}"><big>NEXT</big></a> {/block:NextPage}</p>{/block:Pagination} <hr /> <p class="c1"><a href="{RSS}">RSS</a> | <a href="/random">Random</a> | <a href="/archive">Archive</a> | <a href="/mobile">Mobile</a> |</p> </div></td> <td valign="top" width="150" bgcolor="#090701"> <img src="http://static.tumblr.com/vyfkgek/v3flpvsxn/stats.png" alt="image" /> <script type="text/javascript" src="http://st1.freeonlineusers.com/on4.php?id=515862" xml:space="preserve"> </script> <script language="JavaScript" type="text/javascript" xml:space="preserve"> //<![CDATA[ document.write(x_text[z]); //]]> </script> <hr /> <img src="http://simplehitcounter.com/hit.php?uid=1090957&f=0&b=16777215" border="0" height="18" width="83" alt="image" /> <script language="JavaScript" type="text/javascript" xml:space="preserve"> //<![CDATA[ document.write(y_text[z]); //]]> </script> </td> </tr> </table> </body> </html>
