After cufon, wrong text alignment

Question

I'm using cufon to add font to my website, and I have trouble to center the text when Cufon is applyed!

I designed the website as I want but when I apply Cufon, text stay not centered... Without Cufon it's centered!

HTML :

<nav>
    <ul>
        <li>
            <div>
                <a href="/app/MyAccount">Without Cufon</a>
            </div>
        </li>
        <li>
            <div>
                <a class="cufon" href="/app/MyAccount">With Cufon</a>
            </div>
        </li>
    </ul>
</nav>

The CSS:

nav {
    width: 100%;
    height: 110px;
    clear: both;
    overflow: hidden;
    margin-bottom: 6px;
    font-weight: 900;
    text-align: center;
}

ul {
    padding-left: 0px;
}
li {
    background-color: #E3E3E3;
    float: left;
    width: 200px;
    height: 90px;
    list-style-type: none;
    text-align: center;
    color: black;
    display: inline;
}

Cufon :

Cufon.replace('.texte8pt', { fontFamily: 'Helvetica Neue LT Std 45', hover: true });

Thanks to help me!

Answer 1

try this:

HTML

 <div id="divCufon">
      <a class="cufon" href="/app/MyAccount">With Cufon</a>
 </div>

CSS

#divCufon
{
      text-align:center;
}

Or you can try this:

<center><a class="cufon" href="/app/MyAccount">With Cufon</a></center>