title: facebook comment plugin height
body: <p>I am using <code>Facebook comments</code> plugin on my page but the problem is why it is taking entire browser height. I have placed an image which should appear below the comment box but the image is sitting at the bottom of the page since the comment box is occupying the whole browser.</p>
  
  <p>How to restrict tat height??</p>
  
  <p>This is the code I am using.</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;Facebook Plugin Sample - Facebook Comments &lt;/title&gt;
          &lt;meta name="viewport" id="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"&gt;
      &lt;/head&gt;
      &lt;body&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 = "//connect.facebook.net/en_US/all.js#xfbml=1";
            fjs.parentNode.insertBefore(js, fjs);
          }(document, 'script', 'facebook-jssdk'));&lt;/script&gt;
          &lt;div class="fb-comments" data-href="http://example.com" data-mobile="true"&gt;&lt;/div&gt;
          &lt;img src="http://cdn3.1stwebdesigner.com/wp-content/uploads/2009/02/toolbox-icon.jpg" style="border:1px #000 solid;" alt="" /&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And this is how it is showing now</p>
  
  <p><img src="https://i.stack.imgur.com/s303r.png" alt="enter image description here"></p>
  
  <p><strong><a href="http://jsfiddle.net/Kxsrp/" rel="nofollow noreferrer">DEMO</a></strong></p>