adding bullets to header tag in orchard

Question

I created list in orchard and the h1 tag takes the title of the list. I need to add a bullet for the header.

I need bullet before the h1 tag like the below image

http://jsfiddle.net/nRq27/1/

 <header>
    <h1>School info</h1>
  </header>

I used the background:image property, but its not displaying the bullet. how can I get the bullets?

Answer 1

Try:

h1:before {
    background-image: url(http://www.alexander-bown.com/wp-content/uploads/2011/05/big-black-dot.jpg);
    background-repeat: no-repeat;
    background-size: 20px;
    width: 20px;
    height: 20px;
    display: inline-block;
    content:"";
    vertical-align: middle;
}

Updated fiddle here.