Addthis sharing padding/margins - css

Question

I've added addthis share buttons to a page here and I can't get equal margins/distribution across the div width, so there's a gap on the right hand side which takes into account the fluid width.
I've tried proportional margins/paddings at different percentages, but can't seem to make it responsive.
Here's the CSS and the rest is viewable in an inspector:
.bg.social {
border: 1px solid #FCFCFD;
padding: 15px 0;
background: #E4E4E4;
text-align: center;
width: 94%;
margin: 0 0 2em;
height: 32px;
}
.bg.social a {
margin: 0 4%;
padding: 0;
float: none;
}
.addthis_toolbox {
margin: 0 2%;
}
Update: Got it to work with the following, the same as Bartdude's answer:
.bg.social a {
padding: 0 3%;
display: inline-block;
}
.bg.social {
border: 1px solid #FCFCFD;
padding: 15px 0;
background: #E4E4E4;
text-align: center;
width: 95%;
margin: 0 0 2em;
}

Answer 1

Basically, what you want is to be able to use text-align:center on your button links. Problem is you can't do that, as you floated them for them to appear side-by-side.
I would then suggest to change the display of those anchors to display:inline-block (be carefull though it's not supported by older IE versions... I don't find it important myself but maybe your target audience is using it), so that you can both make use of the text-align:center of the parent and still have a margin around each anchor.
Alternatively, I would suggest only putting a right or left margin, and use CSS pseudo classes :last-child or :first-child so that the first or last element don't have that margin. This shouldn't actually make no visible difference, but your CSS would be a bit more clean and modern...

Answer 2

Try setting margin to
.addthis_toolbox {
margin: 0 10%; // from 2 to 10%
}

Answer 3

.addthis_toolbox {
margin: 0 5%;
}

Answer 4

I cleared all the margins and divs in parent and child divs. Then :
.bg.social a { width:20% }// divided to 5 equal part
and dicreased the margin of .addthis_toolbox.addthis_32x32_style span {
.addthis_toolbox.addthis_32x32_style span {margin-left: 20px;}
everything is ok.

Answer 5

Try it, add to your css:
div.foraddthis {
text-align: center;
width: 100%;
}
.addthis_toolbox {
display: -webkit-inline-box;
display: -moz-inline-box;
display: inline-flex;
}
.addthis_default_style .at300b {
float: none;
}
And HTML:
<div class="foraddthis">
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style addthis_32x32_style"> <a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
<a class="addthis_button_google_plusone_share"></a>
<a class="addthis_button_pinterest_share"></a>
<a class="addthis_button_tumblr"></a>
</div>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=xa-529d1f4f354abd32"></script>
</div>
<!-- AddThis Button END -->
Demo: http://jsfiddle.net/vPw7u/