HTML / CSS的Twitter窗口小部件宽度 [英] HTML/CSS for Twitter widget width

问题描述

代码Twitter提供您在html中粘贴的样子如下：

The code Twitter gives you to paste in the html looks like this:

<a class="twitter-timeline" href="https://twitter.com/username" data-widget-id="248169276782018560">Tweets by @username</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="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

它们允许你设置一个高度，我设置为600.当放置在我的网站上（当查看源代码时）：

They allow you to set a height, which I set to 600. When placed on my site I get this (when viewing the source):

<iframe id="twitter-widget-6" classname="twitter-timeline twitter-timeline-rendered" scrolling="no" frameborder="0" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; " width="220" height="600"></iframe>

220宽度是杀了我的。我想要的宽度是容器的全宽，这是100％（对于移动网站）。目前，220的宽度在整个页面的一半以上，并显示一个丑陋的滚动条。

The 220 width is what is killing me. I want the width to be the full width of the container, which is 100% (for a mobile site). Currently the 220 width goes a little more than halfway across the page and displays an ugly scrollbar.

所以，为什么它设置宽度为220，它扩展到它的父宽度？

So, why is it setting the width to 220, and how can I get it to expand to it's parent width?

推荐答案

我使用响应主题，这个CSS代码工作正常。感谢Hjuster。

I use a responsive theme and this css code works fine. Thanks Hjuster.

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

这篇关于HTML / CSS的Twitter窗口小部件宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！