I'm building out this landing page and after the second paragraph I have a list of points to which I have applied a list-style-image to the li.actionItem, however I'm getting the default disc instead of my images. I know the url is working because a) I wrote it in absolute form, b) if you enter that absolute url you get the image (see here) and c) I tried applying the icon instead as a background image with some padding for the text and that works.
I can just do that in the end if I have to (the background image with padding version) but I would prefer to write it as a list-style-image. Plus it's just driving me crazy why it won't show up that way and I'd like to know.
Any thoughts or tips?? Thank you!
Here's the relevant markup at a glance...
<ul id="introPoints">
<li class="actionItem">performed more than <strong>500</strong> surgeries</li>
<li class="actionItem">set more than <strong>3,000</strong> fractured bones</li>
<li class="actionItem">mobilized more than <strong>90</strong> volunteers to Haiti</li>
<li class="actionItem">sent pastors from our DR hospital to minister to the victims</li>
</ul>
ul#introPoints {
list-style-image:url (http://blog.helpcurenow.org/images/campaigns/jan2010/haiticrisis/arrow-green-distress.gif);
list-style-type:disc;
}
li.actionItem {
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
color:#6e5e4c;
font-size:14px;
text-align:justify;
width:580px;
font-style:italic;
margin:10px 0px 10px 20px;
text-indent:15px;
}
li.actionItem strong {
color:#dd7439;
}