How to you make a bullet list with check marks?

4 replies
I want to do a bullet list on one of my posts, but my dashboard only comes with numbered or square lists.

How do I make a list with colored checkmarks like a lot of sites have?
#bullet #check #list #make #marks
  • Profile picture of the author Michael Shook
    Those are usually a specially defined class for your list items (li) that specify a particular graphic like a checkmark as the graphic for the list items.

    Then you have to make sure that you have the graphic uploaded to your site.

    A lot of how this is actually accomplished depends on your theme. And how you have to add custom CSS or even if you are allowed to do it.
    Signature


    {{ DiscussionBoard.errors[3461245].message }}
    • Profile picture of the author Cinneide
      Lots of sites will use a table to create bulleted lists - a coloured checkmark in one cell and the text in the next.

      So they are not using HTML bulleted lists to create this effect.
      {{ DiscussionBoard.errors[3461353].message }}
      • Profile picture of the author MarthaD.
        It's easy enough to copy and paste in an html site but it sounds like you're talking about a word press site and I'm not familiar enough with that to answer but you might want to check in the "web design" section of this site - could be a lot more info there for you.
        Signature

        MarthaD.

        {{ DiscussionBoard.errors[3461705].message }}
  • Profile picture of the author hotseochick
    Here's a site on how to make a bullet list
    <div id="navcontainer">
    <ul id="navlist">
    <li id="active"><a href="#" id="current">Item one</a></li>
    <li><a href="#">Item two</a></li>
    <li><a href="#">Item three</a></li>
    <li><a href="#">Item four</a></li>
    <li><a href="#">Item five</a></li>
    </ul>
    </div>

    To use an image as a bullet point, your html and css should look like this:
    HTML
    <div id="navcontainer">
    <ul id="navlist">
    <li id="active"><a href="#" id="current">Item one</a></li>
    <li><a href="#">Item two</a></li>
    <li><a href="#">Item three</a></li>
    <li><a href="#">Item four</a></li>
    <li><a href="#">Item five</a></li>
    </ul>
    </div>

    CSS
    #navlist { list-style-image: url(images/arrow.gif); }

    If you are working with a dashboard, it would be helpful to know which one so we can help.
    Signature

    End of Line

    {{ DiscussionBoard.errors[3461763].message }}

Trending Topics