CODEWITHSUNDEEP
csshtmltwitter
Morten Hjort
Morten Hjort

Reputation: 1012

Responsive Twitter embeds

Earlier I could use the code below to make the Twitter embeds responsive:

            iframe[id^='twitter-widget-'] { width: 100% }

However this no longer works. I've tried different things, but none would work. Does anyone have a newer fix for this?

You can see it in work here: http://musik.dk/samsmith/

Upvotes: 0

Views: 5426

Answers (3)

Matt M
Matt M

Reputation: 19

The following CSS should work:

.twitter-tweet {
width: 100% !important;
}

Upvotes: 1

RichTea
RichTea

Reputation: 1435

 #twitter-widget-1 {
      width:100%;
 }

However the container that the widget sits in has a min-width so it will align itself to that.

 <section class="mcl mr350">

Upvotes: 2

ImAtWar
ImAtWar

Reputation: 1143

<iframe id="twitter-widget-1" scrolling="no" frameborder="0" allowtransparency="true" class="twitter-timeline twitter-timeline-rendered" title="Twitter Timeline" height="600" style="border: none; max-width: 100%; min-width: 180px; width: 520px;"></iframe>

see the width: 520px;

Upvotes: 0

Related Questions