HTML5/CSS - <ol> with letters and parentheses?
Asked Answered
D

1

6

I'd like to know if it's possible to use letters with ")" intead "." in an ordered list. Something like this:

a) Some text...
b) Some text...
c) Some text...

Until now I'm getting:

a.) Some text...
b.) Some text...
c.) Some text...

So I need to eliminate the points.

CSS:

.theclass ol li{
  margin: 0 0 0 1em;
}

.theclass ol li:before{
  content: ') ';
  position: absolute;
  margin-left: -3.4em;
  text-align: right;
  width: 3em;
}

HTML:

<div class="theclass">
 <ol type="a">
   <li>Some text...</li> 
   <li>Some text...</li>  
   <liSome text...  </li> 
 </ol>
</div>  
Dissert answered 11/11, 2015 at 6:49 Comment(2)
Would be great if you refer this #11946598Fuji
I asked MarLen to refer it in his answer. Thanks.Dissert
M
9

I found this.

I don't have enough points to commend. This is not my solution!

Found it here: Ordered list (HTML) lower-alpha with right parentheses?

Example on Jsfiddle

ol {
counter-reset: list;
margin: 0; }

ol > li {
list-style: none;
position: relative; }

ol > li:before {
counter-increment: list;
content: counter(list, lower-alpha) ") ";
position: absolute;
left: -1.4em; }

I think this is what you are looking for..?

Another answer can be found here: How to remove dot “.” after number in ordered list items in OL LI? answered by Moin Zaman

Manisa answered 11/11, 2015 at 6:57 Comment(3)
Adding counter-reset: list; to ol worked perfectly. Many thaks.Dissert
Could you refer in your answer to #11946598 also? Thanks.Dissert
Just one thing: the question was answered by Moin Zaman. I think it's better to remove "Update" and say: Another answer can be found here: (the link). Thanks.Dissert

© 2022 - 2024 — McMap. All rights reserved.