For some reason, the comments widget "Vkontakte" is not centered horizontally"

Question

For some reason, the comments widget "Vkontakte" is not centered horizontally"

Hello! I insert a piece of code, everything works, but the horizontal alignment of the widget is on the left edge. I tried to use different align, but for some reason everything is ignored, I don't understand anything. Here is a screenshot of the problem:

Here is the html code using

:

<t t-name="website.checkwidget">
    <t t-call="website.layout">
      <div id="wrap" class="oe_structure oe_empty"/>
      <!-- Put this script tag to the <head> of your page -->
      <head>
        <script type="text/javascript" src="//vk.com/js/api/openapi.js?122"></script>
        <script type="text/javascript">
        VK.init({apiId: 1111111, onlyWidgets: true});
        </script>
      </head>
<!-- Put this div tag to the place, where the Comments block will be -->
<p align="center">
<div id="vk_comments"></div>
</p>
<p align="center">
<script type="text/javascript">
VK.Widgets.Comments("vk_comments", {limit: 10, width: "665", attach: "*"});
</script>
</p>
    </t>
</t>

Please tell me what the problem is?

0

html html5 vkontakte-api вконтакте widgets

Author: bulzzz, 2016-07-10

Source

2 answers

score 1 · Answer 1

You need to ask:

#vk_comments { margin: 0 auto; }

1

Author: HamSter, 2016-07-10 18:51:52

score 0 · Answer 2

Or so

.vk-comment-container{
  max-width: 665px;
  margin: 0 auto;
}
#vk_comments,
#vk_comments iframe {
	width: 100% !important;
}

        <script type="text/javascript" src="//vk.com/js/api/openapi.js?122"></script>
        <script type="text/javascript">
        VK.init({apiId: 1111111, onlyWidgets: true});
        </script>
      

<div class="vk-comment-container">
<div id="vk_comments"></div>
</div>

<p align="center">
<script type="text/javascript">
VK.Widgets.Comments("vk_comments", {limit: 10, width: "100%", attach: "*"});
</script>