Nieuws:

Welkom, Gast. Alsjeblieft inloggen of registreren.
Heb je de activerings-mail niet ontvangen?

Auteur Topic: [OPGELOST] Facebook 'like button' CSS  (gelezen 1628 keer)

[OPGELOST] Facebook 'like button' CSS
« Gepost op: 2011/01/28, 15:40:20 »
Ten eerste, sorry als ik dit in het verkeerde forum heb geplaatst. Het is niet programmeren, maar het kwam toch het meest in de buurt met de beschrijving 'Alles over het ontwikkelen van computerprogramma's en websites'.

Ik ben nu bezig met een website waar vrij veel Facebook 'like buttons' in voorkomen. Je kent ze wel:



Nu begrijp ik dat het niet is toegestaan om de styling van de button aan te passen. Daar heb ik vrede mee, dan is het lekker herkenbaar. Maar als ik die button niet mag aanpassen, hoe krijg ik mijn eigen buttons dan in dezelfde style?

Ik heb al geprobeerd met Chromium het element te inspecteren en zelf in de facebook css bestanden gekeken, maar het lijkt wel of ze hun best doen om het ongrijpbaar te maken. Ook heb ik hier via Google een antwoord op proberen te vinden, maar dan krijg ik óf de css van de oude button en niet de huidige, óf duizend artikelen over hoe je de 'like button' op je site kan zetten.

Is er hier iemand handig genoeg met CSS of google om de button style na te maken voor mijn eigen buttons? Inclusief eigen 12x12 images:



Je zou me er een enorm plezier mee doen.
« Laatst bewerkt op: 2011/01/29, 22:20:59 door Kelderkeuken »

Re: Facebook 'like button' CSS
« Reactie #1 Gepost op: 2011/01/28, 18:20:49 »
Het is gelukt:



Wel met een vaste button breedte, maar dat neem ik dan maar voor lief.

#fb-button a{
   font-size:11px;
   font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
   font-weight:400;
   font-style:normal;
   text-align:left;
   text-decoration:none;
   padding-top:3px;
   padding-left: 6px;
   padding-bottom:4px;
   padding-right:0px;
   color:#3B5998;
   line-height:13px;
   width:96px;
   height:20px;
   background-repeat:no-repeat;
   border-style:none;
   display:inline-block;
   background-image:url(images/button-empty.gif);
}
#fb-button a:hover{
   background-image:url(images/button-hover.gif);
}
#fb-button img{
vertical-align:bottom;
padding-right:1px;
}