Currently facing an unusual issue. I am creating a Wordpress theme with Cufon and it works flawlessly in Chrome and Firefox, but refuses to render in IE. I decided to put this problem on hold and focus on it later as I am still in the development phase.
Yesterday, while making adjustments to other CSS elements in my theme, I decided to check the alignment in IE8 and surprisingly, the Cufon started displaying correctly. I didn't exactly understand why it started working, considering I had made significant CSS changes, but hey, it was working and that's what matters.
However, my own mistake was that I accidentally replaced the new CSS with the old one, undoing my previous edits, and the Cufon stopped working again. Now I find myself in a dilemma as I don't remember what fixed it initially, but at least I know it's possible.
I have searched extensively online but haven't found any explanation for this peculiar behavior. Both the CSS and HTML are valid, there are no errors in the Firefox Error Console upon page load, and it seems like a CSS-related issue since that was the only file I modified.
One thing worth mentioning is that I am using Wordpress 3.0 for this project.
To embed Cufon on each page's header, I am using the following code snippet:
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/cufon-yui.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/Yanone_Kaffeesatz_Rg_400.font.js"></script>
<script type="text/javascript">
Cufon.replace('h2.posttitle');
Cufon.replace('#topnav > ul > li');
Cufon.replace('.rightwidget > h2');
Cufon.replace('.footerrightli > h2');
Cufon.replace('.footerleftli > h2');
Cufon.replace('.footermiddleli > h2');
</script>
The development site can be accessed here: [link removed]
I would greatly appreciate any assistance. Does anyone have any insights or suggestions?