#### 30.11.1 Understanding the problem with HTML lists

You might have already discovered that no matter how you map your numbered lists, they do not render correctly in one browser or another. This problem is the result of a difference in how browsers indent list items. The situation is described in Eric Meyer's CSS book for O'Reilly, 3rd Ed., pp. 377-378. Basically, you can indent with either margin or padding. So Internet Explorer and Opera use this:

ul, ol {margin-left: 40px; }

Firefox and other Gecko browsers use this:

ul, ol {padding-left: 40px; }

Both methods comply with standards, but they create a compatibility issue. The fix is to override one or the other in your own CSS, depending on how you prefer to indent your own list items. If you use padding, add (for example):

ul, ol {margin-left: 0; padding-left: 1em; }

If you use margins, add:

ul, ol {margin-left: 1em; padding-left: 0; }

DITA2Go sets both margin and padding:

ul.Bulleted1 {
margin-left: 18pt;
padding-left: 12pt;
list-style: disc;
}

ol.Numbered1 {
margin-left: 18pt;
padding-left: 12pt;
list-style: decimal;
}

DITA2Go uses separate rules for ol and ul because some viewers (notably the JavaHelp viewer) do not follow CSS cascading rules correctly.

Previous Topic: 30.11 Converting list formats to HTML (deprecated)

Next Topic: 30.11.2 Converting list formats to HTML list styles

Parent Topic: 30.11 Converting list formats to HTML (deprecated)

Sibling Topics:

30.11.2 Converting list formats to HTML list styles

30.11.3 Indenting list items

30.11.4 Converting list formats to HTML/XML paragraphs

Table of Contents • Index