在twitter bootstrap上使用foreach显示每行四个结果

Question

I'm working with twitter bootstrap framework and need to display a long resultset with the foreach control structure.

To gain space, I'd like to display 4 results per "bootstrap row", like this:

<div class="row">
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
</div>

<div class="row">
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
</div>

//...more bs rows

How should I build the php foreach structure to render the above html?

Thanks

Answer 1

I think you don't even have to start a new row manually. If you just echo all your elements with the class "col-md-3" in one "row" it should break automatically after 4 and its even more flexible for a responsive website.

Like this:

<div class="row">
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
    <div class="col-md-3">
        1 table row
    </div>
</div>