window.onload = function() {
var img = document.getElementById("imgLoader");
var span = document.getElementById("spanLoader");
canvasLoaderReplace(img, {color:'red'});
canvasLoaderReplace(span, {backgroundColor:'red', radius:'40'});
};
So if you were ever trying to style an ordered list <ol> and get rid of those pesky periods after the numbers you may have wanted to give up.
Much better than manually adding the numbers and styling them in a very un-semantic way. Now of course this works in Firefox and Webkit and not much else, but that's okay. I need it for an iPhone app, so we're good!
<style>
nav {
margin-left: 20px;
margin-right: 30px;
color: #666;
}
ol { counter-reset: item }
li {
display: block;
margin-top: 10px;
}
nav ol li span {
font-family: 'GothamBook', Arial;
font-size: 1.6em;
}
ol li::before {
content: counter(item) " | ";
counter-increment: item;
font-family: 'GothamLight', Arial;
font-size: 2.2em;
}
</style>
<nav>
<ol>
<li><a href="#">Why mobile?</a> <span>Quotes and figures to astound your clients.</span></li>
<li><a href="#">Focus.</a> <span>Using constraints to improve design across the board.</span></li>
<li><a href="#">Capabilities.</a> <span>What can mobile phones do now-a-days?</span></li>
<li><a href="#">Native vs. Web App.</a> <span>Which is a better fit for your needs?</span></li>
<li><a href="#">Workflow.</a> <span>What happens to your app when it comes through our door.</span></li>
<li><a href="#">Cost.</a> <span>An arm and a ...</span></li>
<li><a href="#">Know before you start.</a> <span>10 essentials that can save your app.</span></li>
<li><a href="#">What's on the horizon?</a> <span>Mobile trends to keep in mind.</span></li>
<li><a href="#">Help me.</a> <span>We’re here to help you with all your Mobile needs..</span></li>
</ol>
</nav>
Thank you:
http://efreedom.com/Question/1-3153019/Remove-decimal-from-ordered-ol-list-via-CSS