Stackoverflow - How to stop image repetition in html?

http://stackoverflow.com/q/8678370/918414

by dmitri14

HTML

<ul>
    <li><a class="a" href="#">Home</a></li><!--
    --><li><a class="a" href="aboutus.html">About Us</a></li><!--
    --><li><a class="a" href="T&C.html">Training</a></li><!--
    --><li><a class="a" href="services.html">Services</a></li><!--
    --><li><a class="a" href="Contactus.html">Contact Us</a></li>
</ul>






























































































































































































































































































































































































































































<script>
    
/* by: thinkingstiff.com
license: http://creativecommons.org/licenses/by-nc-sa/3.0/us/ */
    
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-23915674-6']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

var headerUri = 'http://stackoverflow.com/q/8678370/918414',
headerCaption = 'How to stop image repetition in html?';
document.body.insertAdjacentHTML( 
'afterBegin',
  '<a href="' + headerUri + '" '
+ 'target="_top" '
+ 'onmouseover="this.style.opacity=\'.95\'" '
+ 'onmouseout="this.style.opacity=\'1\'" '
+ 'style="'
    + 'background-color: black;'
    + 'background-image: linear-gradient( top, rgba( 255, 255, 255, .3), rgba( 255, 255, 255, 0) );'
    + 'background-image: -webkit-linear-gradient( top, rgba( 255, 255, 255, .3), rgba( 255, 255, 255, 0) );'
    + 'background-image: -moz-linear-gradient( top, rgba( 255, 255, 255, .3), rgba( 255, 255, 255, 0) );'
    + 'background-image:...

CSS

ul {
    background-color: #d0e9ff;
    margin: 0;
    padding: 0;
    white-space: nowrap;
}

li {
    display: inline-block;   
    padding: 4px 0 4px 4px;
    width: 19.5%;
}

a {
    background-color: gray;
    border-radius: 16px;
    color: white;
    display: block;
    font: bold 11px arial, verdana, san-serif;
    height: 32px;
    line-height: 32px;
    text-align: center;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}