title: Dev Tools Dimensions vs Screenshot Dimensions
body: <p>I'm trying to resize a bootstrap modal window. In the Chrome dev tools I can see that the width and height are appropriately set by using the following CSS rules:</p>
  
  <pre><code>.manage-modal-dialog {
    width: 450px;
  }
  
  .manage-modal-content {
    width: 450px;
    min-height: 460px;
    max-height: 460px;
  }
  </code></pre>
  
  <p>However, when I screenshot the modal and measure it in a image editing tool, it shows that the dimensions are <code>562x574</code>. Admittedly, I may have cropped incorrectly and be off by a pixel or so but that doesn't account for the large pixel difference I'm seeing.</p>
  
  <p>I see this consistently across browsers (tested Chrome, Firefox, and IE 11) and I can confirm that adjusting the <code>width</code> and <code>min-height</code> in the dev tools adjusts the modal as expected.</p>
  
  <p>What is the reason for this difference? Am I missing something?</p>