hkalant:
The size of the box is defined by the plugin CSS.
Add this to your style.css file:
.twitter-tweet-rendered {
max-width: 100% !important;
}
Thread Starter
hkalant
(@harryplusk)
Hello,
Thanks!
It doesn’t work though.
I don’t use a plugin to embed tweets. I use the new WordPress 3.4 feature by just pasting the tweet link in my post.
hkalant:
First, let’s make sure that we’re talking about the same thing. You’re talking about the boxes next to the large double quote, correct?
If that’s true, then it looks to me like there’s a twitter widget involved because the id of the first box is id=”twitter-widget-0″. But that doesn’t matter because the CSS is setting a specific size for the box at 440px.
I tested the CSS I provided by using Firefox and Firebug. It does work. But, I determined where the current CSS originates. It’s coming from: http://platform.twitter.com/embed/embed.css . This appears to be a CSS file from twitter. This CSS file is loaded last, so the specification in this file of max-width: 550px !important is applied. Because it’s last, it overrides anything before it – like style.css.
I assume this file is being loaded automatically. If not, remove it from whatever is loading it. Other options: 1) Use another technique for adding your tweets; 2) Load a CSS file after embed.css that includes the CSS I provided.
Thread Starter
hkalant
(@harryplusk)
Yes, we are talking about the same thing.
(Can you still see the large double quote? I thought I deleted it…)
Anyway, it seems that embed.css
is being loaded automatically and last.
Is there any way for the style.css
to be loaded last?
You’ll need to create a child theme.
One option would be to load a new CSS file using the wp_head hook.
The other option would be to copy the header.php file, modify it and upload it to the child theme. The modification would be to load the existing style.css file after the wp_head hook. It appears that the twitter css file is being loaded by using the wp_head() hook.
Thread Starter
hkalant
(@harryplusk)
Ok, I will try these options. Thanks again!
.post .twitter-tweet-rendered {
max-width: 100% !important;
}