The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> (a), (b), (c) rather than a., b., c. for list items
Befuddled
post Jan 6 2019, 03:36 AM
Post #1





Group: Members
Posts: 7
Joined: 6-January 19
Member No.: 26,789



ol.abcde li {list-style-type: lower-alpha;} has list items within OL class abcde start with "a.", "b.", etc. That's halfway to what I want.

I dimly remember that CSS allows one to have these appear instead as "(a)", "(b)", etc., or indeed as any other string of characters before and after the variable. If I could think of the name of the relevant property, I'd look it up in one of the various references. However, I can't think of the name of the property. Anyone know?

(Or am I just imagining this?)
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Jan 6 2019, 05:59 AM
Post #2


.
********

Group: WDG Moderators
Posts: 9,630
Joined: 10-August 06
Member No.: 7



See here: https://www.w3.org/TR/css-lists-3/ but unfortunately browsers don't seem to support it yet.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Befuddled
post Jan 6 2019, 07:19 AM
Post #3





Group: Members
Posts: 7
Joined: 6-January 19
Member No.: 26,789



Thank you, Christian J.

If it's not supported, then I shouldn't be using it. That aside, it looks completely unfamiliar. I thought that there was some widely supported mechanism whereby one could add set text to the beginning and to the end of anything--but come to think of it, using this on LI would give me:

(a. Cardinal Ximénez)
(b. Cardinal Biggles)
(c. Cardinal Fang)

--not at all what I want.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Jan 6 2019, 10:43 AM
Post #4


.
********

Group: WDG Moderators
Posts: 9,630
Joined: 10-August 06
Member No.: 7



QUOTE(Befuddled @ Jan 6 2019, 01:19 PM) *

I thought that there was some widely supported mechanism whereby one could add set text to the beginning and to the end of anything

Yes, I was complicating things in my previous post, sorry. blush.gif This seems well supported:

CODE
li {
list-style: none; /* removes default numbers */
counter-increment: foo;
}

li:before {content: "(" counter(foo, lower-latin) ") ";}

CSS2.1 still seems to be the official spec for these properties: https://www.w3.org/TR/2011/REC-CSS2-20110607/generate.html but more are in the works:
https://www.w3.org/TR/CSS22/generate.html
https://www.w3.org/TR/css-lists-3/
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Befuddled
post Jan 7 2019, 08:41 AM
Post #5





Group: Members
Posts: 7
Joined: 6-January 19
Member No.: 26,789



Yes, this looks familiar. Too tired to try it out now, but I expect and hope to do so tomorrow.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th March 2024 - 09:04 AM