pseudo element - right-align CSS before: numbers? -
i want have numbered paragraphs without resorting using ordered lists. i'm trying accomplish using content:counter(paragraph) in css every paragraph block create generates number left of it.
.pass { counter-reset:paragraph; } .pass p:before { content:counter(paragraph); position:absolute; font-size:0.6em; color:#999; margin-left:-3em; counter-increment: paragraph; }
it works fine, problem can't figure out how align numbers align right.
so instead of:
7 content 8 content 9 content 10 content
i want them this:
7 content 8 content 9 content 10 content
is there way accomplish without ol , li?
set width :before class, text-align:right. http://jsfiddle.net/qax8m/
.pass {counter-reset:paragraph;} .pass p {padding-left:40px;} .pass p:before { content:counter(paragraph); counter-increment: paragraph; position:absolute; left:0; width:40px; text-align:right; }
Comments
Post a Comment