3 Columns then Force Next Row and Repeat

[GrooveOnBeat]

What I want to do is display 3 columns per row.

The Page code is:

{{foreach $rows as $row}}
	{{$idField = $row::$databaseColumnId;}}

    ...content...

{{endforeach}}

I've tried to do a template logic like below but failed:

  {{if $row % 3 == 2}}
    line break
  {{endif}}

  {{if $row == 3}}
    line break
  {{endif}}

 

How do I do it?

[GrooveOnBeat]

Didn't work either...

  {{if $row % 3 == 0}}
    line break
  {{endif}}

or

  {{if count($rows)}}
    {{foreach $rows as $id}}
      {{if $id % 3 == 0}}
        line break
      {{endif}}
    {{endforeach}}
  {{endif}}

[GrooveOnBeat]

I've been trying different things but not getting the results.

Any ideas?

[Meddysong]

You'd need to use the ipsGrid class, I think. Something like:

<div class="ipsGrid">
{{foreach $rows as $row}}
  {{$idField = $row::$databaseColumnId;}}
  <div class="ipsGrid_span4">
		... stuff 		
  </div>
{{endforeach}}
</div>

 

[GrooveOnBeat]

18 hours ago, Meddysong said:

You'd need to use the ipsGrid class, I think. Something like:

<div class="ipsGrid">
{{foreach $rows as $row}}
  {{$idField = $row::$databaseColumnId;}}
  <div class="ipsGrid_span4">
		... stuff 		
  </div>
{{endforeach}}
</div>

 

As specified in the layout.css, I didn't think about using that. Thanks!

With this I can customize or even redo the classes to customize the width, margin, and padding. Thank you!