css - 根据屏幕大小调整 Twitter 小部件的大小

Question

所以我的网站可以根据屏幕大小调整大小，但是当我实现一个 Twitter 小部件时，当我尝试调整它的大小时，该小部件尽管具有属性 width:'auto' 却没有调整大小。这是小部件的代码:

<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 2,
  interval: 30000,
  width: 'auto',
  height: 100,
  theme: {
    shell: {
      background: '#dbdbdb',
      color: '#000000'
    },
    tweets: {
      background: '#dbdbdb',
      color: '#000000',
      links: '#000000'
    }
  },
  features: {
    scrollbar: true,
    loop: false,
    live: false,
    behavior: 'all'
  }
}).render().setUser('jackstonedev').start();
</script>

这是小部件的 CSS:

#twittercontainer
{
    border:3px solid;
    border-radius:20px;
    background-color:lightgrey;
    opacity:0.7;
    max-width:500px;
    margin: auto;
}

Answer 1

令人恼火的是，你不能用新的 Twitter 小部件做到这一点，旧的 API 将于 2013 年 3 月被合并，但我写了一些关于如何使用 jquery 使用新小部件解决它的东西，尽管这是一种相当简单的方法: http://tappetyclick.com/blog/2012/12/20/how-dynamically-resize-new-twitter-widget