Formatting for drop-down headings does not carry over

[jcatlin]

I use drop-downs a lot in WebHelp: headings, field explanations, figures, and tables. They all work perfectly.

I did not create a separate CSS for Mobile. Everything looks just fine, just like WebHelp, including the drop-downs—with one exception: drop-down headings. Why just that one? Why isn't it true for all other drop-downs? It's driving me crazy!

I researched this until I was blue in the face. Deciding that being blue would hinder my social life, I stopped looking and decided to ask you, my fellow Flare users, if any of you have come across a similar problem and what you did to correct it.

If you want to see what I'm talking about, compare these two corresponding pages from WebHelp and Mobile:

• http://www.mpay.com/webhelp/#Millennium ... gister.htm
• http://www.mpay.com/mobile/Advanced/Con ... gister.htm

Any and all help would be greatly appreciated.

[kwag_myers]

Are you setting the MCDropDownHead style or MCDropDownHotSpot? If you look at the source code (below), notice the Hotspot span is the last style and, therefore rules what style is displayed. I had some trouble with this, too. I'm not really sure what the purpose of the Head class is.

Code: Select all

<div class="MCDropDown MCDropDown_Open dropDown "><span class="MCDropDownHead dropDownHead  dropDownHead Heading2"><span class="MCDropDownHotSpot dropDownHotspot  MCDropDownHotSpot_" title="Drop Down">Date Selection</span></span>

The only other difference I see is that the class names in the mobile output have no spaces:

Code: Select all

MCDropDownHead_ MCDropDownHead_Heading2

I'm using version 9, and my class names are much shorter and the hotspot is a link, not a span:

Code: Select all

<div class="MCDropDownHead_0"><a class="MCDropDownHotSpot_0"...

If you're using an older version, there may be a support issue with Mobile that was fixed in later versions.

That's all I can come up with. I hope you can find the fix.

[jcatlin]

Thanks, I've looked at the generated code since you brought this to my attention. Frankly, I have no idea what to make of it. I'm using Version 9.

When I first started creating drop-down areas using the heading as the first line, I let the entire heading be the hot spot. I also read the Flare help and tried just using the first letter as the hot spot. In both cases, the result was that the heading (<MadCap:dropDownHead>) was now tiny and without formatting; so, I made classes to match each heading. After I create the drop-down of the text in the XML Editor, I right-click on the box that represents the heading paragraph and select the appropriate class.

The code in the Text Editor looks like this:

Code: Select all

<MadCap:dropDown>
    <MadCap:dropDownHead class="Heading2">
        <MadCap:dropDownHotspot>Date Selection</MadCap:dropDownHotspot>
    </MadCap:dropDownHead>

Works great in WebHelp. Perfect. The formatting for my figure titles and table titles (captions above the images and tables) work great, too.

The formatting for the figure and tables titles work great for the Mobile WebHelp, as well. Perfect. But the formatting for the headings in Mobile does not carry over. I don't get it.

[NorthEast]

The formatting for the figure and tables titles work great for the Mobile WebHelp, as well. Perfect. But the formatting for the headings in Mobile does not carry over. I don't get it.

It's a bug - virtually no drop down formatting works in Mobile - i.e. |DropDown, |DropDownBody, |DropDownhead, or |DropDownHotspot and its pseudo classes (like hover).

(Mobile has a few other style bugs too - e.g. you can't have multiple body classes.)

[jcatlin]

It's a bug - virtually no drop down formatting works in Mobile - i.e. |DropDown, |DropDownBody, |DropDownhead, or |DropDownHotspot and its pseudo classes (like hover).

(Mobile has a few other style bugs too - e.g. you can't have multiple body classes.)

Ah. Thanks, Dave, I appreciate it.