title: 2 foreach in 1 table is not work correctly
body: <p>I'm try to loop 2 query inside one table . both query had 10 records . so i put my first foreach (or looping) before <strong>TR</strong> tag ..</p>
  <p>here is example of the table that i want to create :</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.table, th, td { border: 1px solid}</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;table&gt;
          &lt;thead&gt;
            &lt;tr&gt;
              &lt;th colspan=2&gt;&lt;center&gt;Out Of Stock&lt;/center&gt;&lt;/th&gt;
              &lt;th colspan=2&gt;&lt;center&gt;Sales By Qty&lt;/center&gt;&lt;/th&gt;
            &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;      
              &lt;tr&gt;
               &lt;td&gt;Data 1 from 1st Query&lt;/td&gt;
               &lt;td&gt;Data 1 from 1st Query&lt;/td&gt;
               &lt;td&gt;Data 1 from 2nd Query&lt;/td&gt;
               &lt;td&gt;Data 1 from 2nd Query&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
               &lt;td&gt;Data 2 from 1st Query&lt;/td&gt;
               &lt;td&gt;Data 2 from 1st Query&lt;/td&gt;
               &lt;td&gt;Data 2 from 2nd Query&lt;/td&gt;
               &lt;td&gt;Data 2 from 2nd Query&lt;/td&gt;
              &lt;/tr&gt;
               &lt;tr&gt;
               &lt;td&gt;Data 3 from 1st Query&lt;/td&gt;
               &lt;td&gt;Data 3 from 1st Query&lt;/td&gt;
               &lt;td&gt;Data 3 from 2nd Query&lt;/td&gt;
               &lt;td&gt;Data 3 from 2nd Query&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
               &lt;td&gt;Data 4 from 1st Query&lt;/td&gt;
               &lt;td&gt;Data 4 from 1st Query&lt;/td&gt;
               &lt;td&gt;Data 4 from 2nd Query&lt;/td&gt;
               &lt;td&gt;Data 4 from 2nd Query&lt;/td&gt;
              &lt;/tr&gt;
          &lt;/tbody&gt;
        &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>I don't know how i can make my table like that with data from my database..</p>
  <p>so i tried and put the first Foreach out the TR tag and close it after /TR tg. so as we can see there is 4 TD /TD inside TR /TR . so i put the second foreach in the middle between 4 TD /TD .</p>
  <p>just like this :</p>
  <pre><code>        &lt;table&gt;
          &lt;thead&gt;
            &lt;tr&gt;
              &lt;th colspan=2&gt;&lt;center&gt;Out Of Stock&lt;/center&gt;&lt;/th&gt;
              &lt;th colspan=2&gt;&lt;center&gt;Sales By Qty&lt;/center&gt;&lt;/th&gt;
            &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;   
            &lt;?php foreach($First_Data as $row){?&gt;   
              &lt;tr&gt;
               &lt;td&gt;Data 1 from 1st Query&lt;/td&gt;
               &lt;td&gt;Data 1 from 1st Query&lt;/td&gt;
           &lt;?php foreach($Second_data as $row){?&gt;
               &lt;td&gt;Data 1 from 2nd Query&lt;/td&gt;
               &lt;td&gt;Data 1 from 2nd Query&lt;/td&gt;
           &lt;?php }?&gt;
              &lt;/tr&gt;
            &lt;?php }?&gt;
          &lt;/tbody&gt;
          &lt;/table&gt;
  </code></pre>
  <p>and the result was not perfect and i guess  my foreachs are in the wrong place .</p>
  <p>and here u can see the result of my try :</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;style&gt;
  #customers {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
  }
  
  #customers td, #customers th {
    border: 1px solid #ddd;
    padding: 5px;
  }
  
  #customers tr:nth-child(even){background-color: #f2f2f2;}
  
  #customers tr:hover {background-color: #ddd;}
  
  #customers th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: orange;
    color: white;
  }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
        &lt;table id="customers" &gt;
          &lt;thead&gt;
            &lt;tr&gt;
              &lt;th colspan=2&gt;&lt;center&gt;Out Of Stock&lt;/center&gt;&lt;/th&gt;
              &lt;th colspan=2&gt;&lt;center&gt;Sales By Qty&lt;/center&gt;&lt;/th&gt;
            &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD STRAW 70 ML BANDED 4&lt;/td&gt;
          &lt;td&gt;89%&lt;/td&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD STRAWBERY MANGGO LF&lt;/td&gt;
          &lt;td&gt;88%&lt;/td&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD BLUEBERRY 250 ML&lt;/td&gt;
          &lt;td&gt;85%&lt;/td&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD MIXED BERRIES 250 ML&lt;/td&gt;
          &lt;td&gt;85%&lt;/td&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD BLUEBERRY 70 ML BND4&lt;/td&gt;
          &lt;td&gt;84%&lt;/td&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD MIXED 70 ML BANDED 4&lt;/td&gt;
          &lt;td&gt;84%&lt;/td&gt;
          &lt;tr&gt;
          &lt;td&gt;YOLITE C+100 ORANGE &lt;/td&gt;
          &lt;td&gt;84%&lt;/td&gt;
          &lt;tr&gt;
          &lt;td&gt;YOLITE C+100 ORIGINAL&lt;/td&gt;
          &lt;td&gt;84%&lt;/td&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD BANANA LF&lt;/td&gt;
          &lt;td&gt;83%&lt;/td&gt;
          &lt;tr style="background-color: yellow;"&gt;
          &lt;td&gt;CIMORY YD PLAIN 250 ML&lt;/td&gt;
          &lt;td&gt;82%&lt;/td&gt;
          &lt;td&gt;YD-004&lt;/td&gt;
          &lt;td&gt;390&lt;/td&gt;
          &lt;/tr&gt;
          &lt;td&gt;YD-005&lt;/td&gt;
          &lt;td&gt;363&lt;/td&gt;
          &lt;/tr&gt;
          &lt;td&gt;YD-006&lt;/td&gt;
          &lt;td&gt;248&lt;/td&gt;
          &lt;/tr&gt;
          &lt;td&gt;YD-002&lt;/td&gt;
          &lt;td&gt;240&lt;/td&gt;
          &lt;/tr&gt;
          &lt;td&gt;YD-008&lt;/td&gt;
          &lt;td&gt;153&lt;/td&gt;
          &lt;/tr&gt;
          &lt;td&gt;YD-069&lt;/td&gt;
          &lt;td&gt;137&lt;/td&gt;
          &lt;/tr&gt;
          &lt;td&gt;YD-072&lt;/td&gt;
            &lt;td&gt;132&lt;/td&gt;
          &lt;/tr&gt;
          &lt;td&gt;YD-015&lt;/td&gt;
          &lt;td&gt;111&lt;/td&gt;
          &lt;/tr&gt;
          &lt;td&gt;YD-010&lt;/td&gt;
          &lt;td&gt;111&lt;/td&gt;
          &lt;/tr&gt;
          &lt;td&gt;YD-001&lt;/td&gt;
          &lt;td&gt;72&lt;/td&gt;
          &lt;/tr&gt;
          &lt;/tbody&gt;
          &lt;/table&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>only one row (yellow background) is correct and the others are not . i dont know why . maybe my foreach is not correct or i put it in the wrong place .</p>
  <p>and here what i want to achieve but i dont know how :</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;html&gt;
  &lt;head&gt;
  &lt;style&gt;
  #customers {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
  }
  #customers td, #customers th {
    border: 1px solid #ddd;
    padding: 5px;
  }
  #customers tr:nth-child(even){background-color: #f2f2f2;}
  #customers tr:hover {background-color: #ddd;}
  #customers th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: orange;
    color: white;
  }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
       &lt;table id="customers" style="width: 80%" &gt;
          &lt;thead&gt;
            &lt;tr&gt;
              &lt;th colspan=2&gt;&lt;center&gt;Out Of Stock&lt;/center&gt;&lt;/th&gt;
              &lt;th colspan=2&gt;&lt;center&gt;Sales By Qty&lt;/center&gt;&lt;/th&gt;
            &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD STRAW 70 ML BANDED 4&lt;/td&gt;
          &lt;td&gt;89%&lt;/td&gt;
          &lt;td&gt;YD-005&lt;/td&gt;
          &lt;td&gt;363&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD STRAWBERY MANGGO LF&lt;/td&gt;
          &lt;td&gt;88%&lt;/td&gt;
          &lt;td&gt;YD-006&lt;/td&gt;
          &lt;td&gt;248&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD BLUEBERRY 250 ML&lt;/td&gt;
          &lt;td&gt;85%&lt;/td&gt;
          &lt;td&gt;YD-002&lt;/td&gt;
          &lt;td&gt;240&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD MIXED BERRIES 250 ML&lt;/td&gt;
          &lt;td&gt;85%&lt;/td&gt;
          &lt;td&gt;YD-008&lt;/td&gt;
          &lt;td&gt;153&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD BLUEBERRY 70 ML BND4&lt;/td&gt;
          &lt;td&gt;84%&lt;/td&gt;
          &lt;td&gt;YD-069&lt;/td&gt;
          &lt;td&gt;137&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD MIXED 70 ML BANDED 4&lt;/td&gt;
          &lt;td&gt;84%&lt;/td&gt;
          &lt;td&gt;YD-072&lt;/td&gt;
          &lt;td&gt;132&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
          &lt;td&gt;YOLITE C+100 ORANGE &lt;/td&gt;
          &lt;td&gt;84%&lt;/td&gt;
          &lt;td&gt;YD-015&lt;/td&gt;
          &lt;td&gt;111&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
          &lt;td&gt;YOLITE C+100 ORIGINAL&lt;/td&gt;
          &lt;td&gt;84%&lt;/td&gt;
          &lt;td&gt;YD-010&lt;/td&gt;
          &lt;td&gt;111&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD BANANA LF&lt;/td&gt;
          &lt;td&gt;83%&lt;/td&gt;
          &lt;td&gt;YD-001&lt;/td&gt;
          &lt;td&gt;72&lt;/td&gt;
          &lt;tr&gt;
          &lt;td&gt;CIMORY YD PLAIN 250 ML&lt;/td&gt;
          &lt;td&gt;82%&lt;/td&gt;
          &lt;td&gt;YD-004&lt;/td&gt;
          &lt;td&gt;390&lt;/td&gt;
          &lt;/tr&gt;
          &lt;/tbody&gt;
          &lt;/table&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>can someone tell me how and i'll be so thankful..
  and sorry if my English is not really good because its not my mother tongue</p>