WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: RE: Formatting lists

for

Number of posts in this thread: 3 (In chronological order)

From: Jukka Korpela
Date: Wed, Oct 23 2002 11:37PM
Subject: RE: Formatting lists
No previous message | Next message →

Glenda Watson Hyatt wrote:

> I am working with ordered lists, and need to use parentheses
> around the numbers, ie (1)...(2)..., as used in legislation subsections.

In theory, you could use normal <ol> markup in HTML and counters and
generated content in CSS, as described in section 12 of the CSS2
specification:
http://www.w3.org/TR/REC-CSS2/generate.html

Example of a style sheet:

OL { counter-reset: item }
LI { display: block }
LI:before { content: "(" counter(item) ") ";
counter-increment: item }

But this is not a practical move at present. Browser support seems to be
limited to Opera. Non-CSS browsers naturally use their default presentation
for <ol>. The problems begin when browsers with _partial_ CSS support come
into the picture. For example, Netscape displays the list as completely
unnumbered and unbulleted.

> Or shall I stick to using paragraphs to maintain the
> punctuation? You know how gov't types are about that kind of stiff.

No, if it's logically a numbered list, use <ol> markup. This will help in
many situations where the visual presentation is irrelevant.

As a workaround, though, you might consider using <ul> markup with the
numbers as explicit content, and a CSS rule that suggests suppression of
bullets:
<style type="text/css">
ul li { list-style-type: none; }
</style>
...
<ul>
<li>(1) foo
<li>(2) bar
</ul>

--
Jukka Korpela, senior adviser
TIEKE Finnish Information Society Development Centre
http://www.tieke.fi/
Diffuse Business Guide to Web Accessibility and Design for All:
http://www.diffuse.org/accessibility.html


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/


From: Glenda Watson Hyatt
Date: Thu, Oct 24 2002 10:20AM
Subject: RE: Formatting lists
← Previous message | Next message →


Thanks for the suggestion, Jukka. However, what happens when a uses is not
viewing with stylesheets and thus can't find subsection (2)(i)? I guess I
will stick with invalid markup [<p> within a <li>], till I can find a better
solution.

Cheers,
Glenda

> -----Original Message-----
> From: Jukka Korpela [mailto: = EMAIL ADDRESS REMOVED = ]
> Sent: Wednesday, October 23, 2002 11:29 PM
> To: ' = EMAIL ADDRESS REMOVED = '
> Subject: RE: Formatting lists
>
>
> Glenda Watson Hyatt wrote:
>
> > I am working with ordered lists, and need to use parentheses
> > around the numbers, ie (1)...(2)..., as used in legislation
> subsections.
>
> In theory, you could use normal <ol> markup in HTML and counters and
> generated content in CSS, as described in section 12 of the CSS2
> specification:
> http://www.w3.org/TR/REC-CSS2/generate.html
>
> Example of a style sheet:
>
> OL { counter-reset: item }
> LI { display: block }
> LI:before { content: "(" counter(item) ") ";
> counter-increment: item }
>
> But this is not a practical move at present. Browser support seems to be
> limited to Opera. Non-CSS browsers naturally use their default
> presentation
> for <ol>. The problems begin when browsers with _partial_ CSS support come
> into the picture. For example, Netscape displays the list as completely
> unnumbered and unbulleted.
>
> > Or shall I stick to using paragraphs to maintain the
> > punctuation? You know how gov't types are about that kind of stiff.
>
> No, if it's logically a numbered list, use <ol> markup. This will help in
> many situations where the visual presentation is irrelevant.
>
> As a workaround, though, you might consider using <ul> markup with the
> numbers as explicit content, and a CSS rule that suggests suppression of
> bullets:
> <style type="text/css">
> ul li { list-style-type: none; }
> </style>
> ...
> <ul>
> <li>(1) foo
> <li>(2) bar
> </ul>
>
> --
> Jukka Korpela, senior adviser
> TIEKE Finnish Information Society Development Centre
> http://www.tieke.fi/
> Diffuse Business Guide to Web Accessibility and Design for All:
> http://www.diffuse.org/accessibility.html
>
>
> ----
> To subscribe, unsubscribe, or view list archives,
> visit http://www.webaim.org/discussion/
>


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/


From: Leo Smith
Date: Fri, Oct 25 2002 11:31AM
Subject: RE: Formatting lists
← Previous message | No next message

Glenda,

Jukka's suggestion is a good one that should work for you, even if
users do not have style sheets enabled. Essentially, all that you
are hiding with the CSS is the bullet. If CSS is off, then you will
simply get the bullet followed by the section (2)(i) which you will
enter textually.

You are preserving the structural markup of a list (albeit an
unordered versus an ordered one), whilst getting the presentation
that you are looking for, with the addition of a bullet when style
sheets are switched off - not a big deal.

My 2 cents...

Leo.

On 24 Oct 2002, at 10:08, Glenda Watson Hyatt wrote:

> Thanks for the suggestion, Jukka. However, what happens when a uses
> is not viewing with stylesheets and thus can't find subsection (2)(i)?
> I guess I will stick with invalid markup [<p> within a <li>], till I
> can find a better solution.
>
> Cheers,
> Glenda
>
> > As a workaround, though, you might consider using <ul> markup with
> > the numbers as explicit content, and a CSS rule that suggests
> > suppression of bullets: <style type="text/css"> ul li {
> > list-style-type: none; } </style>
> > ...
> > <ul>
> > <li>(1) foo
> > <li>(2) bar
> > </ul>
> >
> > --


Leo Smith
Web Designer/Developer
USM Office of Publications and Marketing
University of Southern Maine
207-780-4774


----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/