How to customize facebook comments styles?

Question

css

Greetings.
Now the code on the page is:
<div id="fb-root"></div>

<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/ru_RU/sdk.js#xfbml=1&version=v2.3&appId=realAPPID";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<div class="fb-comments" data-href="http://test.workinspect.ru/" data-width="600" data-numposts="4" css="http://mysite/1.css?234" data-colorscheme="light"></div>

The last div changed to:

<fb:comments css="http://mysite.ru/1.css?345345" href="http://mysite.ru/" num_posts="10" width="500"></fb:comments>

With inveterate persistence, I can not connect my style file. The information stubbornly googled, basically it is many years old and does not help.
I check the fact of connecting the file in this way, in the logs there should be an appeal to the file. He is not.
What am I doing wrong, please tell me.

Answer 1

I'm not sure about the correctness, but I would try to change specific style rules with JS to the necessary ones or add ids / classes to the necessary elements with the same JS, the styles of which are written in the file but "!important" is added at the end to override those already assigned.
In general, first you need to figure out the source of comment styles, and then decide how to interrupt them.

Answer 2

This is about what you need, but deeper customization is required.
That is, the specified approach, as I understand it, cannot change the "POST" button or the height of the comment, or make the avatar in a circle. And that is exactly what is required.