4th Mysql Row missing when dividing in <tr> (3 per table-row 1 per colum)

Question

4th Mysql Row to be displayed is missing when dividing the result rows in <tr> elements, 3 items per row (3 per table-row 1 per colum)

This is an example of what I get:

Data #1 - Data #2 - Data #3
Data *#5* - Data #6 - Data #7

I've tried some topics from here but I couldn't achieve anything good :(

My code is:

<table class="table" cellpadding="5px" cellspacing="5px"> 
    <?php 
    $query_sql = mysql_query("SELECT * FROM table WHERE id='$id'");
    $counter = 0;
    while($row_row = mysql_fetch_assoc($query_sql)) {
        if ($counter++ % 3 == 0) {
           if ($counter > 0) {
               $output .= '</tr>';
           }
           $output .= '<tr>';
       }
       echo '<div class="col-md-4" style="border: #000 solid 1px;">                        
                  <div class="row" style="background-color: '.$row_c_border.';">
                    <div class="col-md-12">
                        <h4 class="text-white"><i class="icon-beaker" title="'.$row_course_degree['1'].'"></i>&nbsp;&nbsp;'.$row_row['place'].'&nbsp;'.$row_certified.'</h4>                    
                   </div>
                 </div>
                 <div class="row" style="background-color: #F5F5F5;">
                    <h6>&nbsp;&nbsp;&nbsp;<i class="icon-chevron-sign-right text-success" title="Began"></i>&nbsp;2009-01-11&nbsp;&nbsp;&nbsp;<i class="icon-flag text-info" title="Ended"></i>&nbsp;2015-01-11</h6>
                 </div>                           
                <div class="row">                                                 
                    <div class="col-md-2">                                           
                         <div style="height: 7px;"></div>
                         <img width="60px" height="62.5px" style="border: #F5F5F5 solid 1px;" src="'.$row_row['logo'].'" title="Establishment">       
                    </div>  
                    <div class="col-md-6" style="border-left: #F5F5F5 solid 1px"> 
                                &nbsp;
                    </div>
                 </div>
                 <div class="row" style="background-color: #F8F8FF;">
                    <div class="col-md-12">
                        <h6><i class="icon-info-sign"></i>&nbsp;&nbsp;'.$row_row['description'].'</h6>                
                   </div>
                 </div>
                </div>';
    }
    if ($counter > 0) {
        $output .= '</tr>';
    }

    ?>

</table>

Answer 1

A couple of problems stand out.

Firstly

if ($counter++ % 3 == 0) {
       if ($counter > 0) {

the second test will always be true as the $counter is incremented on the previous line.

Secondly, You are not outputting <td> tags for the table cells.

either one of these problems will produce invalid html which could be the cause of your display issues.