I'm trying to force an embedded tweet to behave responsively by setting its width to 100%.
I've attempted adjusting the width inline as follows:
<blockquote class="twitter-tweet" width="100%">...</blockquote>
I've also attempted styling the twitter-tweet class as follows:
blockquote.twitter-tweet {width:100% !important}
Both approaches have failed. Is this simply being overwritten by the script Twitter requires to be included with the tweet embed? (The script can be referenced at http://platform.twitter.com/widgets.js.)
Any help in forcing the embed to 100% width would be very much appreciated.
Cory, this is not possible using Twitter's provided embed. Well, it's possible to some extent, but only up to 520px. See https://dev.twitter.com/docs/embedded-timelines.
However, you can add width="2000" like this `
<a class="twitter-timeline" width="2000" href="https://twitter.com/twitterapi" data-widget-id="YOUR-WIDGET-ID-HERE">Tweets by @twitterapi</a>
` And then adjust your CSS. It's not the best solution, though.
there's an old post that might be of use for you, don't know if still works, but worth a view, check it out at http://kovshenin.com/2012/quick-tip-how-to-make-tweet-embeds-responsive/