title: Print: Div side by side
body: <p>I need your help. I have a form that have 2 div side by side (on the left &amp; right), as 2 columns.</p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="col-lg-12" id="printable"&gt;
        &lt;div class="col-lg-6"&gt;
          &lt;form role="form"&gt;&lt;/form&gt;
        &lt;/div&gt;
  
        &lt;div class="col-lg-6"&gt;
          &lt;form role="form"&gt;&lt;/form&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and I have two javascript to print those div</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  function printDiv_1(divName) {
      var printContents = document.getElementById(divName).innerHTML;
      var originalContents = document.body.innerHTML;
  
      document.body.innerHTML = printContents;
      window.print();
      document.body.innerHTML = originalContents;
  }
  
  function PrintDiv_2() {
      var divContents = document.getElementById("printdivcontent").innerHTML;
      var printWindow = window.open('', '', 'height=200,width=400');
      printWindow.document.write('&lt;html&gt;&lt;head&gt;&lt;title&gt;Print DIV Content&lt;/title&gt;');
      printWindow.document.write('&lt;/head&gt;&lt;body &gt;');
      printWindow.document.write(divContents);
      printWindow.document.write('&lt;/body&gt;&lt;/html&gt;');
      printWindow.document.close();
      printWindow.print();
  }
  </code></pre>
  
  <p></p>
  
  <p>but the result <strong>in the pdf file</strong> format always sequence, from top to down of the page. It becomes 2 rows.</p>
  
  <p>how to overcome this issue ?
  I think, there are something in the javascript that I miss.</p>
  
  <p>Thank in Adv.</p>