Editing a CSS
The Style List dialog is used to modify and create the styles within your project CSS files.
The following information is pertinent only if you have a legacy Doc-To-Help project in which you worked in HTML5 source files. If you work only with Word source files, this information does not apply to you.

For a quick overview, see Style List Dialog.
- In Doc-To-Help, open the Project ribbon, and at the bottom of the Project group click
. The Project Settings dialog opens.
- From the Default CSS field, select the stylesheet you want to edit.
- From the drop-down, click (edit selected style sheet…).

For a quick overview, see Style List Dialog.
- In Doc-To-Help, open the Home ribbon, and at the bottom of the Target group click
. The Help Targets dialog opens.
- From the Style sheet field, select the stylesheet you want to edit.
- From the drop-down, click (edit selected style sheet…).

Note It is possible to convert Word source documents in HTML5 in Doc-To-Help and therefore create a CSS file. However, you cannot edit HTML5 documents in this version of Doc-To-Help. The main reason for converting Word source documents to HTML5 is to then convert your project to MadCap Flare.
Note The Style List dialog opens in Simple Mode. If you click the Advanced Mode button , the Style List dialog will display the inheritance of the styles. The Source and Target CSS will differ in levels of inheritance. The Target CSS will have additional levels because it inherits from the Source CSS. This is a time-saver, since a change to the Source CSS is automatically saved to the Target CSS.
Note To add a CSS, click (add style sheet…) from the appropriate drop-down in either the Help Targets dialog or Project Settings dialog.
Note To remove a CSS, click (remove style sheets…) from the appropriate drop-down in either the Help Targets dialog or Project Settings dialog. Removing a CSS in this manner will only remove it from the drop-down list, not your machine.

If you modify a read-only style, it will be saved as a derived style; a style that is based on the original (the original will remain untouched). You can also modify any editable style.
- In the Style List dialog (Simple Mode), choose the style you’d like to edit from the list.
- Click the Modify button. The Style Formatting dialog opens.
- Edit the Font, Background, Border, Box, Paragraph, and/or Position via the tabbed windows.
- Click OK. A WYSIWYG view of the style is displayed in the Name column.
In Advanced Mode, you can also view how Doc-To-Help manages styles. When you modify a style in a read-only stylesheet, Doc-To-Help will copy the style and save it to the editable version of the stylesheet.
Example
C1H_Source_full.css is a default stylesheet and is locked (indicated by the icon below). If you choose to modify the BlockText style, Doc-To-Help will create a new BlockText style and save it in the editable Source.css stylesheet.

- In the Style List dialog (either mode), click the New Style button . The Style Formatting dialog opens.
- On the General tab, enter a Style name. This will be the name of the style in the CSS. The name cannot include spaces or punctuation.
- From the Style type drop-down box , choose Character or Paragraph.
-
(Optional) If you would like to use an existing style as a starting point, select a Base style. Please note that the new style will appear as a "child" of this style in the Style List dialog.
Read-only styles will not appear in this list, if you would like to create a style based on one (a derived style), see How to Modify a Style.
- Edit the Font, Background, Border, Box, Paragraph, and/or Position via the tabbed windows.
- Click OK. The new Style name appears in the Style List dialog.

- In the Style List dialog (either mode), choose the style you’d like to delete from the list.
- Click the Delete button .
- Click OK.
Note Read-only styles and the styles derived from them cannot be deleted.

- In the Style List dialog (Advanced Mode), choose the stylesheet you would like to modify from the list.
- Click the Modify button. The Style Sheet Properties dialog opens.
-
In this dialog, you can change the Base style sheet of the CSS (i.e., the stylesheet from which the CSS inherits). You can also make a stylesheet editable or non-editable using the Read-only check box.
Note You should not change default Doc-To-Help read-only stylesheets (e.g., C1H_Source_full.css) from read-only to editable since these CSS files are inherited by the main CSS.
- Click OK.