Chat Icon on mobile jump to the left side instead of right.

Hi @samuelng527,

The reason that this is happening is that you have custom CSS rules interfering with the rendering of the plugin.

Specifically, in the file: https://theoldco.net/eazea/wp-content/uploads/fusion-styles/01d34dd9323106feefa08a3fa3bd9055.min.css
…you have a rule for “.widget.facebook_like iframe” which is overriding the plugin’s width (forcing it to 100%). This is causing many, if not all of the display issues you are seeing.

Removing that rule will fix the display of the plugin.

Hope this helps,

Facebook Team

Hi,

I don’t see this file, https://theoldco.net/eazea/wp-content/uploads/fusion-styles/01d34dd9323106feefa08a3fa3bd9055.min.css, what i am having at the theoldco.net/eazea/wp-content/uploads/fusion-styles folder are the below files.

08c5bd452cd7b8d39c572e47d83d897a.min.css
9295c676791d75fa41434b05a76e3391.min.css
c2346c0009344ba2314dcb167a12dfa3.min.css
d7e7bed8e317c3575fbe5926b4bb643f.min.css
fab735eedbafa6a6e65149bd2954e178.min.css

Please guide me where to delete https://theoldco.net/eazea/wp-content/uploads/fusion-styles/01d34dd9323106feefa08a3fa3bd9055.min.css

Thank you.

Hi @samuelng527,

When I looked again, the rule was now in the file: https://theoldco.net/eazea/wp-content/uploads/fusion-styles/08c5bd452cd7b8d39c572e47d83d897a.min.css
…so I guess there’s something about this framework that cycles the CSS filenames, or something.

In any case, I would just search through the files for the rule “.widget.facebook_like iframe”, and remove/modify it as required.

Hope this helps!

Facebook Team

Hi,

I have deleted “.widget.facebook_like iframe” from all the min.css files but the Facebook Chat icon still floating left on mobile.

Please help.

Hi @samuelng527,

It seems to look okay now when I try it on simulator. If you’re still having display issues, it’s highly likely that there are other CSS rules which are interfering with the plugin’s display. Best way to debug this is to deploy the plugin on a blank page (with no scripts or stylesheets), and gradually add back all the stylesheets/rules one-by-one, to determine which one is causing the interference.

Hope this helps!

Facebook Team