HTML entities in CSS bullet counter-style

[prowlett]

I have something like this:

\documentclass{article}
\begin{document}
    \begin{enumerate}
        \item[\textbf{Q1}] Hello.
        \item[\textbf{Q2}] Well?
        \item[\textbf{Q3}] Goodbye.
    \end{enumerate}
\end{document}

which produces HTML output like this:

The HTML is like this:

    <article class="item-content" id="item-content">
         <style>
@counter-style a0000000002-symbols {
    system: fixed;
    symbols:  '<b class="bfseries">Q1</b>' '<b class="bfseries">Q2</b>' '<b class="bfseries">Q3</b>';
    suffix: ' ';
}
</style>
<ol class="enumerate" id="a0000000002" style="list-style: a0000000002-symbols;">
<li id="a0000000003" value="1">
<p>
Hello. 
</p>
</li>
<li id="a0000000004" value="2">
<p>
Well? 
</p>
</li>
<li id="a0000000005" value="3">
<p>
Goodbye. 
</p>
</li>
</ol>

    </article>

Doing it without the bold like this

\documentclass{article}
\begin{document}
    \begin{enumerate}
        \item[Q1] Hello.
        \item[Q2] Well?
        \item[Q3] Goodbye.
    \end{enumerate}
\end{document}

works fine, producing output like this:

There's something about escaping HTML entities within the CSS. For example (not that I'd want to do this!) I tried,

\documentclass{article}
\begin{document}
    \begin{enumerate}
        \item[\&] Hello.
        \item[<] Well?
        \item[~] Goodbye.
    \end{enumerate}
\end{document}

which produces output like this:

generating this HTML:

    <article class="item-content" id="item-content">
         <style>
@counter-style a0000000002-symbols {
    system: fixed;
    symbols:  '&amp;' '&lt;' '&#160;';
    suffix: ' ';
}
</style>
<ol class="enumerate" id="a0000000002" style="list-style: a0000000002-symbols;">
<li id="a0000000003" value="1">
<p>
Hello. 
</p>
</li>
<li id="a0000000004" value="2">
<p>
Well? 
</p>
</li>
<li id="a0000000005" value="3">
<p>
Goodbye. 
</p>
</li>
</ol>

    </article>

[christianp]

Yeah, this is another point against the counter-style method. Thanks for pointing it out.

Last week I was working on a different method using CSS subgrids, which I'll try to merge in soon.