Ordered list setting for <ol MadCap:continue="true">

[Bonnie Kern]

An ordered list is restarted after insertion of a picture. The picture is conditioned as "Print only". The WebHelp output displays spacing above the continued list item larger than intended. See attached; the conditioned picture is between steps 4 and 5.

The WebHelp output shows the continued list item tagged as <ol MadCap:continue="true">.

How do we enforce uniform spacing above the continued list item in step 5)?
Do we modify the setting for <ol MadCap:continue="true">?
If so, where is that setting located?

Thank you,
Bonnie Kern

[LTinker68]

Depends on how you inserted the picture. If it's inside a paragraph tag, then make sure you applied the print-only condition to the containing <p> tag, not to the <img> tag.

Also, see if you have a margin-top or padding-top attribute set on the <ol> tag. If you do, then you could be getting extra spacing from the second list. In that case, create a custom ol class that has the padding-top or margin-top set to 0 then apply that class to the second ol tag (which you'll have to do by right-clicking the ol block on the left side of the XML Editor, if "show blocks" has been turned on; otherwise you'd have to open the topic in the Internal Text Editor to set the class on the ol tag).

As an alternative, you might want to look into the "Make Paragraph Item(s)" option under the List Actions icon menu. That puts a paragraph tag inside a line item tag (<li><p>...</p></li). You'd still have to apply the print only condition to that paragraph tag, but you wouldn't have to start a new list after the picture.

[brerdane]

I'm a bit anal about my HTML and CSS. Especially since I have several long procedures with lots of screen shots. I also clean up my tables and use table stylesheets.

I open the htm file in an editor and get rid of all the extra tags if I use the GUI for lists of any kind. I also have my notes, warnings and tips within a div. (I would so love having color coding within the Flare text editor as it makes it easier to clean up files.)

I created a div.images that I put my images and caption (below image) inside of. This way the caption doesn't end up as an orphan.

So my list with an image within it would look something like:

<ol>
<li>step</>
<li>step, see fig...</>
<div class="Images">
<img src="../Resources/images/xyz.png" class="MaxWidth600px" />
<p class="captionFigure" MadCap:autonum=" Figure 1-1 "><a name="_XXX"></a> CAPTION TEXT HERE</p>
</div>
<li>step</>
</ol>

You don't have to know HTML and CSS to use Flare but it sure can be your best friend. I never would have gotten my initial projects set up if I didn't know them. However, that was due to the wonderful world of MS Word 2007 and the furball of HTML/CSS it hacks up when you import it to anything.

HTH, Deb

[Bonnie Kern]

Great advice and solution. The following actions worked:

- Used the Make Paragraph Item(s) feature to embed pictures in the list.
- Generated a paragraph class with the correct horizontal and vertical spacing for our list formats.
- Applied the new paragraph class to the embedded paragraph items in the list.

Thanks much!
Bonnie