Page 1 of 1

Web-help mobile header field

Posted: Thu Jan 30, 2014 7:05 pm
by SusanCampbell01
Hello,

I have a quick question. I've been working with the Web-help mobile output and I noticed the text in the header section doesn't seem to change to fit the screen width. There's always some spacing on the right and left of the screen, so the title text is truncated, even though there should be enough room to fit it. For example, it displays "<Product name> over...". Is there a way to adjust the spacing on the left and right side of the text? I just used the H1 or H2 tags. I hope that makes sense.

Re: Web-help mobile header field

Posted: Fri Jan 31, 2014 4:49 pm
by sorin_ristache
Hello,

It is a feature of jQuery Mobile to align the title to the left and limit the space taken by the title to 80% of the width of the browser window. You can increase the width allocated to the title text to 90% or 95% with a custom CSS file that sets the width as in the following example and that you set in the args.css parameter of the Webhelp transformation (you should set also the args.copycss parameter to yes):

Code: Select all

.ui-header .ui-title {
width: 90% !important;
}

Regards,
Sorin