Can't change the width of the Follow button


#1

I’m trying to implement the Twitter Follow button. According to the documentation (https://dev.twitter.com/docs/follow-button), I can specify the button width with the data-width property. However, the rendered button is not the specified width. It is 194px no matter what I do. I have tried both the javascript code and the iframe implementation.

<a href="https://twitter.com/Coach_Coaches" class="twitter-follow-button" data-width="300px" data-align="right">Follow @Coach_Coaches</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="http://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

OR

<iframe allowtransparency="true" frameborder="0" scrolling="no" src="//platform.twitter.com/widgets/follow_button.html?screen_name=Coach_Coaches" style="width:300px; height:20px;"></iframe>

How do I change the button width? Thanks for your help.


#2

It seems that data-width works, but not how one would expect or want it to work.

I’d expect it to apply to the button, and show the button text centered. So a width of 300px would show a 300px wide button. But it’s just a wrapper element for the button, and the button width depends only on the contents.

So apparently there’s no way to show a fixed-width follow element.


#3