Greetings folks,
There seems to be an odd problem with Chrome / Cufon js. Cufon works fine in IE and Firefox, but Chrome is for whatever reason top aligning (vertically) the menu text.
Odd enough, when you load the page, it shows you the text align and quickly top aligned when the cufon js kicks in (happens rapidly but obviously cufon causing this).
It also only happens inside the billing portal strange enough. It uses smarty templates and I've wrapped the scripts in {literal}{/literal} code.
The header template is this:
<!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={$charset}" />
<title>{$companyname} - {$pagetitle}{if $kbarticle.title} - {$kbarticle.title}{/if}</title>
{if $systemurl}<base href="{$systemurl}" />
{/if}
<link rel="stylesheet" type="text/css" href="templates/{$template}/style.css" />
<link rel="stylesheet" type="text/css" media="screen" href="/style.css" />
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" media="screen" href="/code/css/ie.css" />
<![endif]-->
<link rel="shortcut icon" href="http://www.logicweb.com/images/favicon.ico" />
{if $livehelpjs}{$livehelpjs}
{/if}
{literal}
<!-- jQuery Script -->
<script type="text/javascript" src="/code/js/jquery-1.4.2.min.js"></script>
<!-- Cufon Script -->
<script type="text/javascript" src="/code/js/cufon-yui.js"></script>
<script type="text/javascript" src="/code/js/nevis_700.font.js"></script>
<script type="text/javascript" src="/code/js/cufon.js"></script>
<script type="text/javascript" src="/code/js/OfficinaSerITCStd_Medium_italic_750.font.js"></script>
<!-- Dropdown Menu -->
<script type="text/javascript" src="/code/js/hoverIntent.js"></script>
<script type="text/javascript" src="/code/js/superfish.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#header ul li ul li:odd").css("background-color", "#37393d");
$('#header ul').superfish({
delay: 200
});
});
</script>
{/literal}
</head>Keep in mind it works fine in FF and IE.
You can test the working version here:
http://www.logicweb.com/reseller-web-hosting/index.html
The menu is the sub-menu with "reseller hosting" highlighted in red bg. That's the one I'm referring to. Attached is the problem in Chrome, within the billing portal.
