In my ongoing quest to get rid of unnecessary use of WinWord, I moved a two-page checklist into our internal wiki. Unfortunately I came across two problems while doing that:

1. HTML <li>s don't support big empty circles. They default to black bullets, and the CSS {"list-style-type: disc;} only creates tiny circles.

   Unicode to the rescue: \x25EF, also known as \N{LARGE CIRCLE} or ◯ makes a fine replacement. Two lines of CSS to fix your list:

   ul { list-style-type:none; }
   ul li:before { content: "\25EF"; }
   

2. No page breaks. The list was on two pages for a reason and I needed to keep it that way. That was easily fixed by inserting

   <br class="break" /> 
   

   and making the break with CSS:

   br.break { page-break-before: always; }
   

   My first attempt was to use a <hr> instead – but strangely enough it made Firefox print another empty page at the beginning when used inside our wiki.
   

Putting it all together for TWiki:

<!-- <pre> -->
<style type="text/css" media="all">
br.pagebreak { page-break-before: always; }
.patternTopic > ul { list-style-type:none; }
.patternTopic > ul > li:before { content: "\25EF"; }
</style>
<!-- </pre> -->

The .patternTopic makes it only apply within the article, and the > makes it only apply on the first level after that.

– Sec