Style for a Note/Tip

Hi,

Yes you can with css, only not through the RoboHelp css editor.

You do indeed need to create two styles, but in RoboHelp you only select a single one. Simply create a paragraph called "note" and the css takes care of the rest.

You accomplish this using the :before selector. For instance:

p.note {

     /* Styling for the regular text */

}

p.note:before {

     content:"Note: "; /* Text to insert */

     font-weight: bold;

}

This will insert the bold text "Note: " before every paragraph with the class "note". You can also add shading using the text-shadow declaration. That doesn't work with all browsers though.

Alternatively you can create an image and add that to the note paragraph to show an image of the text. That way you can add any styling you like, for example:

p.note {

     background: transparent url(note.png) no-repeat left top;

     padding: 0 0 0 20px; /* Paragraph indents 20 pixels on the left side. Make sure this value is larger than the horizontal image size */

}

If you like, I can email an example file.

Greet,

Willam