Chia dữ liệu thành 3 cột

Bạn có thể làm điều này bằng cách sử dụng toán tử mô-đun, tuy nhiên nó thực sự có thể chỉ với CSS.

Sử dụng display: inline-block , bạn có thể có được hiệu ứng cột tốt. Hãy xem JSFiddle này tại đây . Tôi chỉ sử dụng JavaScript vì tôi lười biếng; <div> danh sách sẽ được tạo bởi PHP trong trường hợp của bạn. Nếu bạn muốn giới hạn chúng ở một chiều rộng nhất định, chỉ cần đặt chúng vào một vùng chứa <div> với chiều rộng cố định.

Tôi đã đưa ra một giải pháp sử dụng bảng, đây thực sự là điều bạn nên làm (bạn chưa đưa ra bất kỳ trường hợp sử dụng đặc biệt nào). Mã bên dưới, cũng như bản trình diễn hoạt động tại đây .

$columns = 4;       // The number of columns you want.

echo "<table>";     // Open the table

// Main printing loop. change `30` to however many pieces of data you have
for($i = 0; $i < 30; $i++)
{
    // If we've reached the end of a row, close it and start another
    if(!($i % $columns))
    {
        if($i > 0)
        {
            echo "</tr>";       // Close the row above this if it's not the first row
        }

        echo "<tr>";    // Start a new row
    }

    echo "<td>Cell</td>";       // Add a cell and your content
}

// Close the last row, and the table
echo "</tr>
</table>";

Và để kết thúc, chúng ta có bố cục tập trung vào cột, lần này quay lại div S. Có một số CSS ở đây; tệp này phải được đặt trong một tệp riêng biệt, không được để trong dòng .

<?php
$rows = 10;     // The number of columns you want.
$numItems = 30;     // Number of rows in each column

// Open the first div. PLEASE put the CSS in a .css file; inline used for brevity
echo "<div style=\"width: 150px; display: inline-block\">";

// Main printing loop.
for($i = 0; $i < $numItems; $i++)
{
    // If we've reached our last row, move over to a new div
    if(!($i % $rows) && $i > 0)
    {
        echo "</div><div style=\"width: 150px; display: inline-block\">";
    }

    echo "<div>Cell $i</div>";      // Add a cell and your content
}

// Close the last div
echo "</div>";
?>