Why don't my ols have numbers any more?

[ChoccieMuffin]

Hi folks.

I'm confused. I am playing with HTML5 as an output, changing from CHM. I am starting with more or less the same stylesheet as worked fine with CHM output, but now all my ols come out with bullets instead of numbers.

Here's the CSS extract for ol:

Code: Select all

ol
	{
		list-style-type: decimal;
		list-style-position: outside;
		line-height: 1.5;
		margin-bottom: 1%;
		margin-top: 1%;
		margin-right: 1%;
		margin-left: 2%;
	}

	li
	{
		margin-top: 0%;
		margin-bottom: 1%;
		font-size: 100%;
		list-style: outside;
		color: #555555;
		line-height: 1.5;
		margin-right: 1%;
		margin-left: 2.5%;
		page-break-inside: avoid;
	}

Is there some basic user error, or setting that I need to change? I've inspected the ol element in the generated output and this is what it looks like:

inspect.png

ps
I notice also that my uls, which have "list-style-type: square;" are just coming out as dots.

[Psider]

Try removing the list-style definition from the li element. I'm not sure why this would affect the list, but playing with a little plain html file outside Flare indicates it does. Maybe not defining all the properties available uses a default list-style-type of disc.

[NorthEast]

Try removing the list-style definition from the li element. I'm not sure why this would affect the list, but playing with a little plain html file outside Flare indicates it does. Maybe not defining all the properties available uses a default list-style-type of disc.

This.

You set a list-style on a list - ol/ul , not a list item - li.

The default type for list-style is disc - so if you inspected the li tag, I'd bet you'd see the list-style-type is disc.

[ChoccieMuffin]

Thanks, both, that worked perfectly. Help much appreciated.

Another example of the joys of ancient inherited stylesheets! I've tidied it up a good bit over the years but didn't do anything with <li>. Funny how the same thing (list-type) was specified for <li> in my previous CHM help and it worked fine, but not for HTML.

[NorthEast]

Thanks, both, that worked perfectly. Help much appreciated.

Another example of the joys of ancient inherited stylesheets! I've tidied it up a good bit over the years but didn't do anything with <li>. Funny how the same thing (list-type) was specified for <li> in my previous CHM help and it worked fine, but not for HTML. :)

CHM is effectively IE7 - so it has IE specific quirks and has CSS support that's very far behind current browsers.
I treat CHM as a completely different output to HTML5 (with a different medium), like I do for PDF.

[ChoccieMuffin]

Thanks, both, that worked perfectly. Help much appreciated.

Another example of the joys of ancient inherited stylesheets! I've tidied it up a good bit over the years but didn't do anything with <li>. Funny how the same thing (list-type) was specified for <li> in my previous CHM help and it worked fine, but not for HTML.

CHM is effectively IE7 - so it has IE specific quirks and has CSS support that's very far behind current browsers.
I treat CHM as a completely different output to HTML5 (with a different medium), like I do for PDF.

Thanks for the additional explanation. I'm going to be doing one or the other, not both, but it's good to know the difference, and your suggestion is one I'm going to keep up. (Based on your very helpful post I'll probably keep the medium I had for CHM in my stylesheet, and only chuck it out once I've done all the conversions for everything).

I'm now fighting with getting my list spacing right so that things line up like they used to in the CHM, and I'm struggling with padding-left, margin-left, for regular lists and nested lists, and I can't get a plain li and li with a p inside to behave the same. Going to hunt through the forums because I know this is often discussed. As I said, I feel like a complete newbie again!