637230 - Page loads then <h3> font size changes after page is loaded.

Status: RESOLVED INVALID

(Firefox :: General, defect)

Description

[Rob]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.2.15pre) Gecko/20110227 Namoroka/3.6.13pre Firefox.3.6 ( .NET CLR 3.5.30729; .NET4.0E)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.2.15pre) Gecko/20110227 Namoroka/3.6.13pre Firefox.3.6 ( .NET CLR 3.5.30729; .NET4.0E)

On Page: http://blogs.amd.com/ (and the rest of their Blogs and some other Sites) the Page will load, then some fonts will change size.


Here is the offending section of the HTML from [right click][View Page Source]:

<div id="featured_info">
								<h3 class="replace"><a href="http://blogs.amd.com/work/2011/02/14/what-are-you-dense/">What Are You? Dense????</a></h3>

								<p>In a word, yes. Density might not be the word that you want to describe you, but when it comes to cl... <a href="http://blogs.amd.com/work/2011/02/14/what-are-you-dense/">Continue Reading</a></p>

								<ul>


The text between the "<h3>" tags "<h3>What Are You? Dense????</h3>" (refers to the increased density of Opteron 6100 cores in a 2U space) is the wrong size _while_ the Page is loading. The font changes size _after_ the Page has finished loading and then looks correct.

It is as though "<h3>" Tags (or is it the '.css' processing) is delayed. It looks ugly the way the fonts are when the Page loads since the letters overlap each other and then once the Page is loaded that section of the Page fixes itself.

I did not notice this last year. 


Firebug looks like this for that section of Code:

<div id="featured_info">
<h3 class="replace">
<a href="http://blogs.amd.com/work/2011/02/14/what-are-you-dense/">
<cufon class="cufon cufon-canvas" alt="What " style="width: 85px; height: 40px;">
</cufon>
<cufon class="cufon cufon-canvas" alt="Are " style="width: 55px; height: 40px;">
</cufon>
<cufon class="cufon cufon-canvas" alt="You? " style="width: 78px; height: 40px;">
</cufon>
<cufon class="cufon cufon-canvas" alt="Dense????" style="width: 160px; height: 40px;">
<canvas width="202" height="38" style="width: 202px; height: 38px; top: 3px; left: -2px;"></canvas>
<cufontext>Dense????</cufontext>
</cufon>
</a>
</h3>
<p>
</p>
<ul>
</ul>
</div>


Thanks,
Rob


Reproducible: Always

Comment 1

[Alex Lakatos[:AlexLakatos]]

This happens because the page uses a scrip that replaces fonts for different classes and ids within the page http://blogs.amd.com//wp-content/themes/amd/javascript/cufon.js . You first see how it looks without any scritps, then the script loads and makes the changes. This is not a bug.

Comment 2

[Rob]

OK, thanks.