title: Facebook Messenger Customer Chat Plugin on mobile website
body: <p>I'm trying to insert Custom Chat plugin on my website. It works perfectly but it does not look good on mobile. I just want it to have the page width, but it looks like this:</p>
  
  <p><a href="https://i.stack.imgur.com/1UmxEm.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1UmxEm.jpg" alt="enter image description here"></a></p>
  
  <p>Here's my HTML code, it's really simple:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;Otto Bot&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;!-- Load Facebook SDK for JavaScript --&gt;
      &lt;div id="fb-root"&gt;&lt;/div&gt;
      &lt;script&gt;(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 = 'https://connect.facebook.net/es_LA/sdk/xfbml.customerchat.js#xfbml=1&amp;version=v2.12&amp;autoLogAppEvents=1';
          fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));&lt;/script&gt;
  
      &lt;!-- Your customer chat code --&gt;
      &lt;div 
        class="fb-customerchat" 
        attribution="setup_tool" 
        page_id="&lt;MY-PAGE-ID&gt;" 
        logged_in_greeting="Hablemos?" 
        logged_out_greeting="Hablemos?"
        minimized='false'&gt;
      &lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I just copied and pasted the code given in my page settings. I've already tried with the instructions given in <a href="https://developers.facebook.com/docs/messenger-platform/reference/web-plugins/#customer_chat" rel="nofollow noreferrer">https://developers.facebook.com/docs/messenger-platform/reference/web-plugins/#customer_chat</a></p>