Question

I’ve been experiencing a really weird bug using cufon in IE8. I’m trying to replace the font of my navigation links with cufon. this works fine in FF, Chrome and most of the time in IE8. But ever so often it seems to apply the link only on the letters of the link. e.g. when I click directly on the letter it will link correctly but when I click between 2 letters of a word the link is not present.
this is how I’ve structured my navigation:

<ul>
    <li class="top_nav"><a href="link1" >link1</a></li>
    <li class="top_nav"><a href="link2" >link2</a></li>
    <li class="top_nav">
        <a href="link3">link 3</a>
        <ul>
            <li><a href="sublink1" >sublink1</a></li>
            <li><a href="sublink2" >sublink2</a></li>
        </ul>
    </li>
</ul>

and this is how I apply cufon

Cufon.replace('.top_nav a');

Answer 1

If possible, turn your links into block elements (css => display: block). I limit my usage of Cufon and apply only to headings and important links. This was the case with the last website I worked on and all Cufon texts were block elements. By the way, I wouldn’t use Cufon today anymore. I prefer the font-face solution with http://www.fontsquirrel.com/.