extra bullet showing on embedded lists

[DeX]

I have an unordered list with an ordered list embedded like so:

 

<ul>
<li>point 1</li>
<li>
<ol>
<li>embedded point 1</li>
<li>embedded point 2</li>
</ol>
</li>
<li>point 3</li>
</ul>

 

Because the <ol> is inside a <li> tag, it adds an extra bullet at the top of the ordered list. Is this normal HTML or would it be something that is haywire inside the CSS? I didn't write the CSS so I'm basically looking for a starting point to look for how to fix this. Thanks!

[Miss_Rebelx]

So what is showing up? Something like this?

 

* point 1

*

  - embedded point 1

  - embedded point 2

* point 3

 

Or something like this?

 

* point 1

*

  -

  - embedded point 1

  - embedded point 2

* point 3

 

If example one:

If you don't want the extra bullet, don't create the extra <li>. Put the ordered list directly into the first bullet.

 

If example two:

(I don't know why it would be doing that... I expect the output of that code to be example 1)

[dbrimlow]

You put the ordered list in a new list item tag. So of course it will show a bullet as any new list item.

 

You need to "embed" the ordered list within the original list-item tags. Remember, the original list item does NOT close until AFTER the closing embedded list tag.

 

<ul>
<li>point 1 <!-- embed ordered list INTO list-item -->
<ol>
<li>embedded point 1</li>
<li>embedded point 2</li>
</ol>
</li> <!-- NOW close original list-item -->
<li>point 3</li>
</ul>

[DeX]

Thanks guys, I figured it out. I'm using Cascade as a content management system so it's modifying the code a little bit to conform to W3C standards, so it is putting the embedded list inside the parent <li> tag like you suggested. That's not causing it though, I looked through the global.css file that we have and it's adding a background bullet image to all <ol><li> tags so I just took it out. Problem solved!