Archived

This topic is now archived and is closed to further replies.

  • 0

Theme Cutting Off Facebook "like" Box Comment Drop-Down


Question

Posted · Report post

Hello, when I install a like button in the content itself (for example in the first paragraph of this post: http://www.danoah.com/2011/11/im-christian-unless-youre-gay.html) the drop-down is cut off and doesn't display properly after a user clicks like.

Google searches lead me to believe that there is a problem with the CSS somewhere. Any idea how I can fix that?

Thanks, Dan

Share this post


Link to post
Share on other sites

12 answers to this question

Posted · Report post

Please visit PageLines -> Site Options -> Custom Code -> Custom CSS/LESS and add the following to the box:

 

body .entry_content iframe {
    max-width: 617%;
}

Hope that helps!

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks Jenny. 
Well, it moves the whole comment box to the left and shows it completely. Which is good and functional.
Stil - Isn't there a "cleaner" solution? like making it appear where it should be? I'm no expert on css, but clearly something is overlapping the comment box.

 

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

 

I think the solution Jenny provided is the best for the present.  You're able to test other CSS options using Firebug for Firefox or Chrome's Inspection Tool.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

I don't use Facebook, so can you take a screenshot of the issue please. Also, where abouts on Facebook did you find the code, can you link it please and where/how did you add it to your site.

One last thing, please do not Bump topics.

Share this post


Link to post
Share on other sites

Posted · Report post

BUMP

Thanks for your reply Rob, stay safe!

Any others have any idea how I can fix this?

Share this post


Link to post
Share on other sites

Posted · Report post

Hi there, the buttons seem to be using inline css which specify the width and height. I'd imagine these settings are built into the widget/plugin somewhere. At the moment it's showing a height: 86px & width: 49px.

I can't any css fixes for this other than the inline options. I'd say email the plugin author and see if he has a fix for the css or a container he can suggest we target.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi. 

I have the same issue with the Facebook like button. I tried using the button with two different plugins, and the behaviour was the same. One of them is the Facebook plugin for wordpress, the other is called Facebook Button Plugin. The guys at the facebook developer forum claim this problem originates in the theme style.

here's a screen shot: 
facebook-bug.jpg

 

I'd appreciate a "custom code" solution...
I have no real knowledge of css coding. 

thanks a lot.

Share this post


Link to post
Share on other sites

Posted · Report post

Dan, I'm not sure why it's doing that. Very weird, I dare say. I'm looking into it and should have some answers by Monday or so. Unfortunately, I'm a hurricane evacuee at the moment, so if I don't answer this again, please bump it to one of my colleagues.

Share this post


Link to post
Share on other sites

Posted · Report post

Looking at your site I am not seeing a Like button in the middle of the paragraph and when I tested all the Like's and Sends for Facebook they seemed to work for me (I'm in fireFox). Would it be possible to include a screenshot so we can troubleshoot, please?

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks.

My like buttons are before and after a post/page's content. I checked it both on latest chrome and safari on mac. The likes and sends are working, but the comment box is cut.  here's a full screenshot:

facebook-bug1-1024x640.jpg

thanks.facebook-bug1-1024x640.jpg

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks for the reply. I don't use a plugin or inline CSS for these with the exception of float:right and padding (this problem happens when I eliminate the inline). I simply copy the code from Facebook's developer site.

I've also tried setting the width higher in the plugin itself.

I'm being told this is definitely theme/css related so any help would be really appreciated.

Share this post


Link to post
Share on other sites