为什么我的标题文本被截断？
我有一个使用带有标题标记的jQuery mobile构建的页面，如下所示：
I have a page built with jQuery mobile with header markup that looks like this:
<div data-role="header">
<h1>The Magnet Puzzle</h1>
</div>
我在Android和Windows手机上测试了它，并在两者中截断了最后三个字符标题文本，即使标题足够宽以适合整个标题：
I tested it out in an Android and a Windows phone, and in both it truncates the last three characters of the header text, even though the header is wide enough to fit the entire title:
我希望它看起来像这样：
I want it to look like this instead:
为什么会被截断，以及如何修复它以便显示整个标题？
Why is it being truncated, and how can I fix it so that it displays the entire title?
我认为真正的问题是JqMobile正在设置左右边距为30％，只留下标题总宽度的40％。将其更改为10％，并在真正需要时获得省略号。
I think the real trouble is that JqMobile is setting the left and right margin to 30% leaving only 40% of the total width for your title. Change that to 10% and you get the ellipsis when you really need it.
.ui-header .ui-title {
margin-right: 10%;
margin-left: 10%;
}