By sholler on

Hi,
I've been struggling with a combination of an ordered (ol) and an unordered list (ul) in HTML.

I'm using the following demo code for the page:

demo list:
<ol>
    <li>first item</li>
    <li>
        second item
        <ul>
            <li>topic</li>
            <li>another topic</li>
        </ul>
    </li>
    <li>third item</li>
</ol>

The result is that the items of the unordered lists overwrite the bullet sign.

Is this a webbrowser related problem or an error in Drupal?

Regards,
Sebastian

⋅ Categories: Drupal 6.x

Comments

yelvington’s picture

yelvington commented
  1. first item
  2. second item
    • topic
    • another topic
  3. third item

Looks fine here. Perhaps you are using a theme with some bad CSS.

sholler’s picture

sholler commented

I'm using the "Garland" theme that comes with Drupal 6.x

nevets’s picture

nevets commented

Garland has this rule in style.css, line 123

ul li, ul.menu li, .item-list ul li, li.leaf {

that disables the bullets and uses a graphic instead.

sholler’s picture

sholler commented

I found out, that the graphical error is caused by a bug in style.css of the Garland theme:

 # line 130, original:
 ol li {
  padding: 0 0 .3em;
  margin-left: 2em; /* LTR */
}

# patched version of line 130:
ol > li {
...

The original CSS style sets the padding of ALL li-elements to 0, even if the li-element belongs to an unordered list inside an ordered list.

Thalassa’s picture

Thalassa commented

If you use color module, don't forget to go to themes>list and "configure" your theme again else changes won't show up after you edit style.css