Loop row in bootstrap every 3 columns

First You should define a variable, then right before the loop ends increment it and echo the closing row tag and open another one depending on it.

Useful steps

• define $i = 0;
• inside the loop make your echos.
• right before the foreach ends increment the $i++ and make a condition : if $i % 3 == 0 then echo the closing tag of the row then generate a new row.

Code :

<div class='row'>
<?php
foreach($items as $item) {
  echo "<div class='col-lg-2'>";
      echo "<div class='item'>";
        echo 'Anythin';
      echo '</div>';
  echo '</div>';
  $i++;
  if ($i % 3 == 0) {echo '</div><div class="row">';}
}
?>
</div>

Tip : You don't really want to foreach the row, its a bad idea, make one row and foreach the items.

You can use array_chunk(input array, size of each chunk) function to chunk your array into pieces.
php.net manual: array_chunk

Chunks an array into arrays with size elements. The last chunk may contain less than size elements.

Here is an example:

<?php

    $numberOfColumns = 3;
    $bootstrapColWidth = 12 / $numberOfColumns ;

    $arrayChunks = array_chunk($items, $numberOfColumns);
    foreach($arrayChunks as $items) {
        echo '<div class="row">';
        foreach($items as $item) {
            echo '<div class="col-md-'.$bootstrapColWidth.'">';
            // your item
            echo '</div>';
        }
        echo '</div>';
    }  
?>

Edit: Originally I posted this quickly from the top of my head. Thanks, Wael Assaf for pointing out an improvement, which I have used. Also, I have added a couple of changes to the code, now it is versatile and can be used for a variable number of columns you can choose by changing the variable $numOfCols

You need to add a div for each row. Then the floating divs you have, will not just wrap around but instead will be in their own container.

The bootstrap class row is perfect for this:

Method 1 (not recommended for new versions of HTML and Browser): This method is for older version on HTML and browser because new versions of HTML and browser have inbuild functions to auto close missing tags so when you use code below it will automatically close pre-defined tag <div class="row"> rather than waiting for if condition to close that tag in result causing improper layout.

Note: you can try and observe result by inspecting elements

<?php
//Columns must be a factor of 12 (1,2,3,4,6,12)
$numOfCols = 4;
$rowCount = 0;
$bootstrapColWidth = 12 / $numOfCols;
?>
<div class="row">
<?php
foreach ($rows as $row){
?>  
        <div class="col-md-<?php echo $bootstrapColWidth; ?>">
            <div class="thumbnail">
                <img src="user_file/<?php echo $row->foto; ?>">
            </div>
        </div>
<?php
    $rowCount++;
    if($rowCount % $numOfCols == 0) echo '</div><div class="row">';
}
?>
</div>

Uses PHP modulus operator to echo the open and close of each row at the right points.

Method 2 (recommended): This method is to overcome the problem faced by method 1, as a result, causing proper layout for modern browser.

<?php
//Columns must be a factor of 12 (1,2,3,4,6,12)
$numOfCols = 4;
$rowCount = 0;
$bootstrapColWidth = 12 / $numOfCols;
foreach ($rows as $row){
  if($rowCount % $numOfCols == 0) { ?> <div class="row"> <?php } 
    $rowCount++; ?>  
        <div class="col-md-<?php echo $bootstrapColWidth; ?>">
            <div class="thumbnail">
                <img src="user_file/<?php echo $row->foto; ?>">
            </div>
        </div>
<?php
    if($rowCount % $numOfCols == 0) { ?> </div> <?php } } ?>

Note: you can try and observe result by inspecting elements

Hope this helps.

No need for all this complexity. Bootstrap works within a 12 col grid system automatically. Just make sure you loop and make col size so that that evenly divides by 12 e.g. col-md-4.

This example will provide 3 per row automatically since 12 / 4 = 3.

<div class="row">
    LOOPCODE
    {
        <div class="col-md-4">
            DATA
        </div>
    }
</div>