Share this page 

HTML list with empty square as bullet styleTag(s): FORM HTML/CSS


HTML UL style provides only filled square as bullet. 
<ul style="list-style-type:square">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

To have an empty square (more like a checkbox), use this CSS. 

ul.emptysquare  {
   list-style-type: "\2610   ";
}
where \2610 is the unicode character for BALLOT BOX

then to use it : 

<ul class="emptysquare">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>
mail_outline
Send comment, question or suggestion to howto@rgagnon.com