文字缩短了

时间:2013-03-15 07:55:34

标签: xcode jquery-mobile mobile ios-simulator

我有以下代码,但我不确定为什么当我使用Xcode iPhone模拟器时它显示...为什么?还是因为我正在使用模拟器

我使用的是jQuery Graphite Theme

问题:

Screenshot if issue

HTML:

        <div data-role="header">
            <h1 class="appTitle">Birthday Reminders</h1>
        </div><!-- Header -->

CSS:

@media only screen and (min-device-width : 320px) and (max-device-width : 480px)
{
.appTitle { max-width:100%; font-size:12px; text-align: center;}
}

1 个答案:

答案 0 :(得分:2)

以下是一个有效的例子:http://jsfiddle.net/Gajotres/GFfAt/

使用的CSS:

.appTitle {
    margin: 0.6em 15% 0.8em !important;
    white-space: normal !important;
}

边距内的15%是文本和应用标题限制之间的左/右空格。

不要降低字体大小,因为标题高度会下降,以抵消它增加的边距。