Here is a mix on how to create a twitter style icon and a tooltip without image (only by playing with border).

first the css you need:

<style type="text/css">  
#twitter {
    position:relative;
    text-decoration:none;
    font-size:10px !important;
    font-style:normal;
    font-weight:normal;
    line-height:10px !important;
}
#twitter .tt {
    display:none;
    position:absolute;
    top:-40px;
    left:30px;
    padding:5px;width:130px;
    background:#E8F5FC;
    border:1px solid #07AAEF;
    color:#07AAEF;
    font-family:Helvetica,Arial,sans-serif;
    text-transform:uppercase;
}
#twitter:hover .tt {
    display: block;
}
#twitter .tt .p, #twitter .tt .ip {
    position:absolute;
    width:0;
    height:0;
    border-bottom-width:0;
    background:none;
}
#twitter .tt .p {
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:5px solid #07AAEF;
    bottom:-5px;
    right:auto;
    left:5px;
    margin-left:-5px;
}
#twitter .tt .ip {
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 3px solid #E8F5FC;
    bottom: auto;
    top:-5px;
    left:-3px;
}
</style>

then the html you need:

<a id="twitter" href="http://twitter.com/parchambault" target="_blank">
    <img src="twitter-icon.gif" alt="Fallow me on twitter" />
    <div class="tt" style="">
        Follow me on Twitter
        <div class="p"><div class="ip"> </div></div>
    </div>
</a>

try them together and you will get this little twitter icon with a tooltip when you hover it :)