Viewing Article

To override the default styling for Tell-a-Friend you simply have to place overriding CSS Styles after you include the gTAFHeader() token in your page. To help, below is the default css styling, you can copy the items you want to change and make your own overriding style.

<style type="text/css">
/* This is the actual panel that opens */
.taf-panel {
   padding:20px;
   width: 500px;
   border: #29216d 1px solid;
   background: inherit;
   position:absolute;
   top:200px;
   left:-541px;
}
 
/* This is the tab itself */
.taf-panel a.taf-tab {
   border-width: 1px 1px 1px 0;
   display:block;
   height:99px;
   left:51px;
   bottom:21px;
   position:relative;
   float:right;
   text-indent:-9999px;
   width:30px;
   outline:none;
   zIndex: 5000;
}
 
textarea {
   width:90%;
   padding:5px;
}
 
#response-message {
   background: #ccc;
   border: 1px solid #999;
   padding:50px;
}
</style>