Pourquoi mon texte d'en-tête tronqué?

J'ai une page construite avec jQuery mobile avec en-tête du code qui ressemble à ceci:

<div data-role="header">
    <h1>The Magnet Puzzle</h1>
</div>

Je l'ai testé dans un Android et Windows phone, et dans les deux il tronque les trois derniers caractères du texte d'en-tête, même si l'en-tête est assez large pour le titre complet:

Pourquoi mon texte d'en-tête tronqué?

Je veux qu'elle ressemble à ceci à la place:

Pourquoi mon texte d'en-tête tronqué?

Pourquoi est-il tronqué, et comment puis-je résoudre ce problème afin qu'il n'affiche que le titre complet?

Êtes-vous sûr de l'en-tête est assez large. Avez-vous vérifié le: width, margin et padding?
Regardez la tête de la bande. Regardez la largeur du texte. Est-il plus large que l'en-tête pour vous?
il est assez difficile de voir padding en regardant l'image 😛

OriginalL'auteur Peter Olson | 2012-01-03