/*new styles to add to the bargraph class for the google chrome watermark*/
.bargraph ul.chrome-watermark {
background: url(http://pics.cssbakery.com/pics/emblemchrome.png) no-repeat;
background-position: 50% 50%;
height: 175px;
}

span.graphfooter {
   color:#c0c0c0; 
   line-height:2em;
}

.graphfooter a:link,  .graphfooter a:visited,
.graphfooter a:hover, .graphfooter a:active {
   color:#c0c0c0;
   font-weight: normal;
   text-decoration: underline;
}
.bargraph ul.bars li { font-size: 12px; }

<!-- markup for the chrome bargraph -->
<div class="bargraph" style= "width: 292px;">
<ul class="bars chrome-watermark">
<li class="bar1 orangebar" style="height: 12px;"><span>6%</span></li>
<li class="bar2 crimsonbar" style="height: 50px;">25%</li>
<li class="bar3 navybar" style="height: 54px;">27%</li>
<li class="bar4 tealbar" style="height: 70px;">35%</li>
</ul>
<ul class="label">
<li>Safari</li>
<li>Firefox</li>
<li>Chrome</li>
<li>IE</li>
</ul>
<ul class="y-axis">
<li>100</li>
<li>75</li>
<li>50</li>
<li>25</li>
<li>0</li>
</ul>
<p class="centered">
Browser Market Share by StatCounter
<span class="graphfooter">&copy;2012 <a href="http://www.cssbakery.com/2009/06/data-visualisation-flexible-bar-graphs.html">bar graphs</a> by cssbakery.com</span></p>
</div>