Dynamic CSS padding for Google +1 button

I have several Google +1 buttons on my website and when a button is clicked a certain amount of times the plus one button on the page becomes wider and therefore moves out of its space given. How could I stop this from happening dynamically?

The CSS code for the button is as follows:

.news-plusone { 
    float: 开发者_开发百科right;
    margin: 2px -20px 0 10px;
}

The second parameter in the margin is the one that needs to change dynamically.

Example: http://www.nblackburn.me/index.php?section=news

The +1 button is included in this segment of HTML on my website (formatted here to remove scrolling):

<span class="news-plusone">
 <g:plusone size="small" href="http://example.com/"></g:plusone>
</span>

Publishers may not alter or obfuscate the +1 Button, and Publishers may not associate the +1 Button with advertising content, such as putting the +1 Button on or adjacent to an ad, or placing ads in shared content, unless authorized to do so by Google. Publishers also may not place in shared content any text, image, or other content that violates the Google+ project's User Content and Conduct Policy.

+1 button policy

However if you were just changing the positioning of the button then possibly showing an example would help clarify your issue.