How do I make a JQuery Mobile header wrap, and left-justified?

问题

The text in my JQuery Mobile headers is often too long to fit on an iPhone screen, which means that the text is truncated, and a button on the right of the header overlaps the text.

Is there any way that I can:

• Make the text wrap instead of run off the right of the screen
• Make the text smaller

回答1:

It looks like the style that handles the ellipsis and wrapping is this:

.ui-header .ui-title, .ui-footer .ui-title {
    text-overflow: ellipsis;
    white-space: nowrap;
}

Try overriding that in your own style:

.ui-header .ui-title, .ui-footer .ui-title {
    text-overflow: clip;
    white-space: normal;
}

来源：https://stackoverflow.com/questions/7003067/how-do-i-make-a-jquery-mobile-header-wrap-and-left-justified