On Fri, 13 Apr 2007, Pamela Denchfield wrote:
> I'm new to CSS, and I'm looking for a way to use the stylesheet to apply the
> following formats to autonumbers (prepended digits) in declared ordered lists:
> * bolding the digits (while other text is normal)
> * removing the periods
>
> Possible? Perhaps not.
Unfortunately, there seems to be no way of doing that without adding
artificial extra markup. In theory, you could use generated content, but
it does not work on IE.
The problem is that browsers treat the numbers as anonymous elements
inside the <li> elements, so anything you set for a <li> element applies
to the number as well, but you can't specify rules for the number
specifically. Using extra markup, though, you can wrap the content proper
of a <li> element in an element that can be styled separately, so that
what you set for <li> has an effect on the number only.
> ol li { font-weight: bold; }
> ol li p { font-weight: normal; }
That's one way of using artificial extra markup, requiring the items to be
coded as <li><p>...</p></li> (or at least <li><p>...). It's more natural
to use <div> markup instead of <p> markup, since the item content is not
necessarily a paragraph, and using <p> markup typically causes some
default spacing. So I'd use
<li><div>...</div></li>
with
ol li { font-weight: bold; }
ol li div { font-weight: normal; }
together with some margins specifically set for the <li> elements (or
<div> elements inside them) if desired. As a rule of thumb, no extra
spacing is needed if the items are short (typically less than one line)
but some extra spacing (e.g. li { margin-bottom: 0.5em; }) is useful if
the items are long.
--
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
