How do I make scaffolding if I would like to show grids next to each other. My actual codes
<div class="span8">
<div class="row-fluid">
<?php foreach($items as $item) : ?>
<div class="span6">
<?= $item ?>
</div>
<?php endforeach; ?>
</div>
</div>
grids are showing like
-------------------
1box 2box
-------------------
3box
-------------------
4box
-------------------
5box
-------------------
I would like to show
-------------------
1box 2box
-------------------
3box 4box
-------------------
5box
-------------------
<div class="span8 mutli-column">
<?php
$c = 0;
foreach( $items as $item ):
//Needs Break Boolean, true if counter at second column
$b = (( ++$c % 2 == 0 ) ? true : false );
if ( $b )
echo '<div class="row-fluid">'; ?>
<div class="span6">
<?php echo $item; ?>
</div>
<?php
if ( $b )
echo '</div>';
endforeach; ?>
</div>
With use of % Modulus, you can calculate every second iteration, thus break into a new .row-fluid
row, to get yourself into a HTML structure like below:
<div class="span8 mutli-column">
<div class="row-fluid">
<div class="span6">1</div>
<div class="span6">2</div>
</div>
<div class="row-fluid">
<div class="span6">3</div>
<div class="span6">4</div>
</div>
<div class="row-fluid">
<div class="span6">5</div>
<div class="span6">6</div>
</div>
<div class="row-fluid">
<div class="span6">7</div>
<div class="span6">8</div>
</div>
</div>
Here's a Fiddle constructed with the above: