In an epub, I would like to style a single lettered list in this manner:
(a) Some text goes here. (b) More text here. (c) This line is longer. It goes on and on. And on some more. And then it keeps going until it wraps. (d) Another long line. This one will wrap too, once it gets to be long enough. You get the idea. The text should always line up while the list letters hang.
The following code will do what I want on a per-list basis:
ol.alpha_list {
counter-reset: item;
}
ol.alpha_list > li {
list-style: none;
position: relative;
}
ol.alpha_list li:before {
counter-increment: item;
content:"(" counter(item, lower-alpha) ") ";
position: absolute;
left: -1.4em;
}
But this doesn't render correctly in my epub file. It comes out like this:
(a) Some text goes here. (b) More text here. (c) This line is longer. It goes on and on. And on some more. And then it keeps going until it wraps. (d) Another long line. This one will wrap too, once it gets to be long enough. You get the idea. The text should always line up while the list letters hang.
Is there any way to make it work like the first example?
try adding "list-style-position: outside;" and "margin-left: 2em;" in the li css.
ol.alpha_list {
counter-reset: item;
}
ol.alpha_list > li {
list-style: none;
position: relative;
list-style-position: outside;
margin-left: 2em;
}
ol.alpha_list li:before {
counter-increment: item;
content:"(" counter(item, lower-alpha) ") ";
position: absolute;
left: -1.4em;
}