yes I can't seem to get enough of sprites
updated
Only registered users can see links on this board! Get registered or login! to show how to use for lists instead of boring dots and squares
many different ways to accomplish, but this is one method... (has to appear before the individual sprite definitions)
Code:ul.sociallinks {
margin-bottom:20px;
float:left;
overflow:visible;
}
ul.sociallinks li {
float:left;
margin-bottom:0.75em;
margin-right:1em;
width:10em;
height:16px;
}
li.socialicon {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin-left:0;
}
.socialicon {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(../images/service_icons.gif) no-repeat scroll 0 0;
padding-left:2em;
}
|
and html
Code:<ul class="sociallinks">
<li class="socialicon aim">AIM</li>
<li class="socialicon amazon">Amazon</li>
<li class="socialicon bebo">Bebo</li>
<li class="socialicon brightkite">Brightkite</li>
<li class="socialicon delicious">Delicious</li>
<li class="socialicon digg">Digg</li>
<li class="socialicon digg-this">Digg This</li>
<li class="socialicon dopplr">Dopplr</li>
<li class="socialicon email">E-mail</li>
<li class="socialicon ebay">eBay</li>
etc..........
|
Welcome to nukeSEO.com !
Forum FAQ
Search
Usergroups
Profile
Log in to check your private messages
Log in
