Support » Plugin: Facebook Comments by Fat Panda » Width 100%

  • josepmon

    (@josepmon)


    Hi everyone,

    I’m trying to make the comment box to take the full with of the available space, and I’ve been trying to use some code which is already not working for me:

    .fb-comments, .fb-comments span, .fb-comments iframe {
        width: 100% !important;
    }

    Using this code is still missing a div that is not affected, which is getting the fixed width. This does not have an static id, and it looks like this:

    <div id="feedback_xxxxxxxxxxx" style="width: 550px;">

    Even if trying to use the following code, it does not work for me:

    div[id^='feedback']{
    	width: 100% !important;
    }

    Any idea of how to solve the issue?
    Thanks in advance.

    https://wordpress.org/plugins/fatpanda-facebook-comments/

Viewing 1 replies (of 1 total)
  • Tyler Johnson

    (@tylerjohnson-libertyalliance)

    Hey Josepmon,

    I know this is 2 months two late, but I thought I’d go ahead and post this for anyone else that is interested, or if you happen to look back at this.

    I was able to get the box to 100% width and here’s how. I used the following CSS:

    #FatPandaFacebookComments {
    margin-top: 12px;
    }
    
    div.fb-comments {
    width: 100% !important;
    }
    
    .fb_iframe_widget span {
    width: 100% !important;
    }
    
    .fb_iframe_widget iframe {
    width: 100% !important;
    }

    But, just that doesn’t make it 100% width. Like you, I ran into the problem of the id=”feedback_xxxxxxxxxx” where the numbers changed on each refresh, so I couldn’t apply any CSS to it.

    You have to go into a plugin file to edit that and make it 100%.

    Go to Plugins > fatpanda-facebook-comments > comments.php

    Find div class fb-comments. Within that div is a data attribute title data-width. Change that width to 100% and you now have a comment box that is 100%.

    And yes, the CSS from the beginning is still needed. Let me know if you have any trouble!

Viewing 1 replies (of 1 total)
  • The topic ‘Width 100%’ is closed to new replies.