0

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.

Attachments menu.png 9.16 KB
2
Contributors
2
Replies
3
Views
6 Years
Discussion Span
Last Post by LogicWeb
0

Hmm... Did you check the elements' attributes after they are rendered? Chrome may have a certain different attributes in box rendering model that Cufon does not support. You may check only the elements that wrongly render. Just my two cents.

Edited by Taywin: n/a

0

Would appreciate help on this please.

Taywin, not sure what you mean. They look similar in Chrome and Firefox for example, so not sure.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.