Coding in header required

Code: Select all

/* Share Buttons */
#share {
	position: absolute;
	top: 88px;
	right: 328px;
	float: left;	
	width: 210px;
	height: 30px;
	text-align: center;
	z-index: 8;
}
#share .twitter{
  display: block;
  width: 30px;
  height: 30px;
  margin-left:0px;
  background: url('../image/twitter.gif') ;
  float: left;
}
#share .facebook{
  display: block;
  width: 30px;
  height: 30px;
  margin-left:0px;
  background: url('../image/facebook.gif') ;
  float: left;
}
#share .myspace{
  display: block;
  width: 30px;
  height: 30px;
  margin-left:0px;
  background: url('../image/myspace.gif') ;
  float: left;
}
#share .linkedin{
  display: block;
  width: 30px;
  height: 30px;
  margin-left:0px;
  background: url('../image/linkedin.gif') ;
  float: left;
}
#share .youtube{
  display: block;
  width: 30px;
  height: 30px;
  margin-left:0px;
  background: url('../image/youtube.gif') ;
  float: left;
}
#share .blogger{
  display: block;
  width: 30px;
  height: 30px;
  margin-left:0px;
  background: url('../image/blogger.gif') ;
  float: left;
}
#share .rss{
  display: block;
  width: 30px;
  height: 30px;
  margin-left:0px;
  background: url('../image/rss.gif') ;
  float: left;
}
#share .twitter:hover, 
#share .facebook:hover, 
#share .myspace:hover, 
#share .linkedin:hover, 
#share .youtube:hover, 
#share .blogger:hover, 
#share .rss:hover
{ 
  background-position: 0 -30px;
}

Code: Select all

<div id="share">
		<a class="twitter" title="twitter" href="https://twitter.com/#!/Cozziemo"></a>
		<a class="facebook" title="facebook" href="http://www.facebook.com/profile.php?id=119152818198860"></a>
		<a class="myspace" title="myspace" href="http://www.myspace.com/576330104"></a> 
		<a class="linkedin" title="linkedin" href="http://nz.linkedin.com/pub/cozziemo-motorsport/43/984/3a2"></a> 
		<a class="youtube" title="youtube" href="http://www.youtube.com/user/CozziemoMotorsport"></a>
		<a class="blogger" title="blogger" href="http://cozziemomotorsport.blogspot.com/"></a>
    </div>

Code: Select all

        <ul class="list-services">
            <li class="first"><a class="tooltips" title="twitter" href="twitter.com"></a></li>
            <li class="second"><a class="tooltips" title="facebook" href="facebook.com"></a></li>
            <li class="third"><a class="tooltips" title="google pluse" href="plus.google.com"></a></li>
            <li class="four"><a class="tooltips" title="yuotube" href="youtube.com"></a></li>
      </ul>

Code: Select all

.list-services {
    position: absolute;
    right: 249px;
    top: 76px;
}

.list-services li {
    float: left;
    padding-right: 5px;
}

.list-services li.first a {
    background: url("../image/twitter.png") no-repeat scroll 0 0 transparent;
}