Basic HTML CSS - Customize AddThis Button

**Mikee** · 08-17-2010, 10:23 PM

Hi!

I am looking to insert an AddThis.com button to my website, but it doesn't work well.

I have this part at the right-top of my website (sort of ''Bookmark Us'' link) :

<body>
<div id="main">
<div id="top">
<div style="float:right"> <span style="display:block; padding-top:30px">(Instead of ''Bookmark Us'' text, I would like the AddThis.com button placed HERE!)</span> </div>

I found this also into the Layout.css maybe will help:

}

img{border:none}

#main{float:left; width:100%}
#top_bookmark{ margin-left:auto; margin-right:auto; width:750px; padding-bottom:5px; text-align:right; padding-right:30px;}
#top{width:780px; margin-top: 0;margin-right: auto;margin-bottom: 0;margin-left: auto; padding-top:0; height:97px}
.clear{ clear:both}

And this is the AddThis standard button:

<div class="addthis_toolbox addthis_default_style">
<a href="http://www.addthis.com/bookmark.php?v=250&username=xa-4c6afe321fabff8c" class="addthis_button_compact">Share</a>
<span class="addthis_separator">|</span>
<a class="addthis_button_facebook"></a>
<a class="addthis_button_myspace"></a>
<a class="addthis_button_google"></a>
<a class="addthis_button_twitter"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4c6afe321fabff8c"></script>

Thank you,

Mike.

**Beverleyh** · 08-18-2010, 08:01 AM

You havent actually said what's wrong - only "it doesn't work well".

What do you want to fix exactly? What is it about the current setup that doesnt do what you want? What do you want it to do instead?

Also provide a link to your website.

**Mikee** · 08-18-2010, 08:27 AM

Still working on the website on my pc, is a free template I found on the web.

The original layout is this:

http://www.mojoimage.com/free-image-...=4409test1.jpg

and here i replace the ''Easily Updatable Website for $100'' with the AddThis code:

http://www.mojoimage.com/free-image-...=1149test2.jpg

With this ''crappy'' result:

http://www.mojoimage.com/free-image-...d=319test3.jpg

Thanks.

**Beverleyh** · 08-18-2010, 01:07 PM

Put a height on the span to increase the space for the icons.

And/or, remove the padding and add a top-margin and bottom-margin instead.

Thread: Basic HTML CSS - Customize AddThis Button

Thread Tools

Search Thread

Basic HTML CSS - Customize AddThis Button

Bookmarks

Bookmarks

Posting Permissions