How to use css count for a user macro? What is missing?

CSS Akademie

Hello,

I have created a user macro with this content

## @noparams

<style>
.ourtest body {
list-style-type: none !important;
counter-reset: css-counter 0 !important;
}

.ourtest p {
counter-increment: css-counter 1 !important;
}

.ourtest p::before {
content: counter(css-counter) ". " !important;
}

</style>

<body>
<div class="ourtest">$body</div>
</body>

expecting to enter text, which will be numbered automatically

HTML:

<p>text1</p>

<p>text2</p>

<p>text3</p>

Result:

1. text

2. text

3. text

But the numbering is missing on the page. Any idea?

Thanks for any support.

 

Bill Bailey

If no numbers are appearing, then you may have a conflict with the space CSS overwriting your CSS. Take a look using the browser inspect function to see if your class is actually being applied and then see what rules are overwriting yours.

Also, you may want to change your structure to add the class to your p tag, rather than the wrapper around it.

More details will help ;-)