I didn’t know this until a conversation with a MadCap tech support person last week. And ever since then, I’ve been using the mess out of it. In fact, it’s been so handy, I wish I’d known about it ages ago. And I use a LOT of div tags – as shown here:

What I’ve done up until now is:

1. Select a group of items that need to be in a div.

2. In the menu bar, go to Format > Group…

3. Select the class from the list of existing div tag classes.

It worked, sure….but I can’t argue that it was efficient. Now, I’d been things this way forEVER so it was second nature to me and I could do it relatively quickly.

Little did I know that there was a quicker way. Are you ready? Watch…and don’t blink, you might miss it….

1. Select the area you want to put in to a div tag.

2. Press the Tab key. No really….that’s it.

3. Now select the class from the list and you’re golden.

It’s so easy, I can’t even show you a screenshot of what I did….because it’s ONE KEY.

Needless to say, I dig it. Thank you, Jose, for telling me about this handy-dandy little shortcut!

I’m currently working on a project that includes creating checklists. These aren’t HTML forms….but rather agenda items that can be checked off as they are addressed.  The checklist has to look good in both online and printed help AND they exist as list items in multi-level lists.

I checked the special character addition feature in Flare and didn’t really see a check box. Additionally, I looked through the unicode lookup URL (admittedly rather casually) and didn’t see what I wanted. So, I created one in Adobe Fireworks:

It’s simple…no drop shadows, nothing. If you want to know how I created it, please let me know.

Since these checkboxes will be used as a bullet for a list item, I had to create a new style class for the <li> tag.  Then I had to create a custom bullet for the new class:

1. Open your stylesheet and scroll to the li tag. Select it.
2. In the stylesheet editor, click Add Class.
3. Name the new class something that will clearly identify what you’re building. In this instance, I used ‘checkbox.’
4. Go to the List section of that li tag and insert the image in the ‘list-style-image’ element.
5. Assign the new li styleclass to the list items to see your changes.

Here’s what my checklist looks like:

Now, I haven’t set any padding or margins…so this is straight out of the box. Not bad!