Overriding bullet colour

Hi,
Is it possible to override the colour of the bullets?

http://www.ebme.co.uk/test/

I tried using inline styles but it doesn't seem to work.

Code: Select all

<ul>
  <li style="color:#000000 !important;"><span style="color:#FF0000">item #1</span></li>
  <li style="color:#808080 !important;"><span style="color:brown">item #2</span></li>
  <li style="color:teal"><span style="color:red">item #3</span></li>
</ul>

Thank you.

Hi,
maybe because those are not bullets but just images:
http://www.ebme.co.uk/templates/gk_twn2 ... 1_dark.png

This is old template maybe that's why ... is "old school" method.

Hi - thanks for that.
So is there anything I can do about it? (It's a Gavick template.)

Thank you.

sure, replace images with yours
and replace changed image file on server.

But that would change all of the bullet colours/ images site wide, wouldn't it?
I need to change the colour on only one page.

Ohhh, okey.
So you have two options:
1) Do not use <ul> </ul> !! only <li> inside
or
2) Do following steps:
a) create new bullet image "newbullet.png" upload in this same folder like others
b) Add new line of code
ul.gkBullet1, div.articleContent ul#new { list-style-image: url("http://www.ebme.co.uk/templates/gk_twn2/images/style1/typography/newbullet.png") !important; }
c) use <ul id="new"> instead of <ul>