Back to top

Affiliate Link: Interested In a Useful Tables For Amazon Products and More? Check Out:

Amalinks Pro

Change Lists From Dots to Blocks Or Other Characters

As an Amazon Associate we earn from qualifying purchases made on our website. If you make a purchase through links from this website, we may get a small share of the sale from Amazon and other similar affiliate programs. You can read our complete legal information for more details.

Many times people want to have something more fancy for a unordered list than just the default dot.

Typical Unordered List

  • This
  • Is
  • The
  • Unordered
  • List
.my_bullet li {
   margin-bottom: 0px;
}

.my_bullet li:before {
    content: "\2714";
    color: #F0533A;
    font-size: 25px;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
    list-style: none;
}

ul.my_bullet {
    list-style: none;
}

Example Unordered List Using My_Bullet Class

  • A
  • Modified
  • Bullet
  • Style

Dingbats Examples (Numbers)

All of the following could be used to generate unique lists where you choose the 4 digit number to use in the above example.

https://www.compart.com/en/unicode/block/U+2700

About Josh Koop

Hey Everyone! I hope that the short article you read today has taken you from a place of frustration to a place of excited anticipation for your visitors! Please let me know of anything you need for Acabado that can help you achieve your goals! Read More About Me...

My Posts | Website

Josh Koop

Hey Everyone! I hope that the short article you read today has taken you from a place of frustration to a place of excited anticipation for your visitors! Please let me know of anything you need for Acabado that can help you achieve your goals! Read More About Me...

Leave a Reply

Your email address will not be published. Required fields are marked *

Recent Content