Advanced Search

Customizing the Facebook Fan Box Widget with CSS

/ Published in: CSS
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. .fan_box a:hover{
  2.   text-decoration: none;
  3. }
  4. .fan_box .full_widget{
  5.   height: 200px;
  6.   border: 0 !important;
  7.   background: none !important;
  8.   position: relative;
  9. }
  10. .fan_box .connect_top{
  11.   background: none !important;
  12.   padding: 0 !important;
  13. }
  14. .fan_box .profileimage, .fan_box .name_block{
  15.   display: none;
  16. }
  17. .fan_box .connect_action{
  18.   padding: 0 !important;
  19. }
  20. .fan_box .connections{
  21.   padding: 0 !important;
  22.   border: 0 !important;
  23.   font-family: Arial, Helvetica, sans-serif;
  24.   font-size: 11px;
  25.   font-weight: bold;
  26.   color: #666;
  27. }
  28. span.total{
  29.   color: #FF6600;
  30.   font-weight: bold;
  31. }
  32. .fan_box .connections .connections_grid {
  33.   padding-top: 10px !important;
  34. }
  35. .fan_box .connections_grid .grid_item{
  36.   padding: 0 10px 10px 0 !important;
  37. }
  38. .fan_box .connections_grid .grid_item .name{
  39.   font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
  40.   font-weight: normal;
  41.   color: #666 !important;
  42.   padding-top: 1px !important;
  43. }
  44. .fan_box .connect_widget{
  45. position: absolute;
  46. bottom: 0;
  47. right: 10px;
  48. margin: 0 !important;
  49. }
  50. .fan_box .connect_widget .connect_widget_interactive_area {
  51. margin: 0 !important;
  52. }
  53. .fan_box .connect_widget td.connect_widget_vertical_center {
  54. padding: 0 !important;
  55. }

URL: http://www.daddydesign.com/wordpress/how-to-customize-your-facebook-fan-box/

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.