4

I have tried everything using css that i can think of , and set with in the embed , but i cant not get it to width more then 500px

https://jsfiddle.net/9d73rhvj/

<a class="twitter-timeline" data-widget-id="694535126655635456" href="https://twitter.com/TwitterDev" width="1300" height="750">Tweets by @PTDcommish</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

CSS i've tried

#twitter-widget-0 { 
      width: 100% !important; 
}

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

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

.twitter-timeline {
    width: 100% !important; 
}
Zakaria Acharki
  • 66,747
  • 15
  • 75
  • 101
MShack
  • 642
  • 1
  • 14
  • 33
  • 1
    it's a widget, not a page; i think that's how twitter wants it. at any rate, you don't control the style, twitter does; your CSS has no effect on xdomain pages. – dandavis Feb 02 '16 at 21:12
  • Its pulling the content in via an iframe. Your CSS wont be able to affect it. – Adam Konieska Feb 02 '16 at 21:13

1 Answers1

3

Twitter has set a maximum width for embedded timelines to 520px, which my guess is as why your solutions aren't working.

From their docs (link):

Dimensions

An embedded timeline list template automatically adjusts to the width of its parent element with a minimum width of 180 pixels and a maximum width of 520 pixels.

Pim
  • 748
  • 8
  • 14