Facebook Like Box Button Flyout Getting Cut Off – Woothemes Canvas

I’ve had this problem with a few themes, most recently with Woothemes Canvas and the social sharing plugin Digg Digg.

Having used Digg Digg many times, and never having had this problem before I was a little confused. I tried dozens of tweaks in the css to try and fix it, tried all the different variations of settings in Digg Digg – but still no dice.

Whenever I clicked Like on a post – it got chopped off like this:

Facebook Like Cut Off

I eventually found the culprit, which for Woothemes Canvas was this line in the css:

/* 1.4 Embedded Videos */
video {
  max-width: 100%;

The above limits the fly-out to the size of the parent element (100% the size of it), to fix it you just need to put this in the Custom CSS:

iframe {
 max-width: none;

After the tweak the entire flyout shows correctly as such:

Facebook Like Box Fixed

I hope this helps someone as it really was a rather frustrating problem.




You can subscribe via e-mail to get my posts in your Inbox, or stalk me on numerous other platforms.

Follow my Dayre!

, , , , , , , , ,

Comments are closed.