用于 Twitter 小部件宽度的 HTML/CSS
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;
}
相关文章