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.
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 ;-)
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Yes, the problem was that the class wasn't overtaken to the p tag. But I changed the structure a little bit and it works:
## @noparams
<style>
.custom-counter {
margin-left: 0;
padding-right: 0;
list-style-type: none !important;
}
.custom-counter ol {
list-style: none !important;
padding: 0;
}
.custom-counter li {
counter-increment: step-counter;
margin-bottom: 20px;
padding-left: 50px;
text-indent: -3.3em;
list-style-position: outside !important;
}
.custom-counter li::before {
content: counter(step-counter);
margin-right: 10px;
color: white;
font-weight: regular;
padding: 2px 16px 2px 12px;
background: url('https://academy.css.de/_images/bg.png') center no-repeat;
background-size: contain;
line-height: 20px;
height: 20px;
}
</style>
<body>
<div class="custom-counter">$body</div>
</body>
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.