Mysql
 sql >> Base de données >  >> RDS >> Mysql

Diviser les données en 3 colonnes

Vous pouvez le faire en utilisant l'opérateur modulus, mais c'est en fait possible avec CSS uniquement.

Utilisation de display: inline-block , vous pouvez obtenir un bon effet de colonne. Jetez un oeil à ce JSFiddle ici . J'utilise JavaScript uniquement parce que je suis paresseux. le <div> la liste serait générée par PHP dans votre cas. Si vous souhaitez les confiner à une certaine largeur, mettez-les simplement dans un conteneur <div> avec une largeur fixe.

J'ai trouvé une solution en utilisant des tables, ce qui est vraiment ce que vous devriez faire (vous n'avez donné aucun cas d'utilisation particulier). Le code est ci-dessous, ainsi qu'une démo de travail ici .

$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>";

Et pour finir, nous avons notre mise en page centrée sur les colonnes, cette fois en revenant à div s. Il y a du CSS ici; cela doit être placé dans un fichier séparé, pas laissé en ligne .

<?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>";
?>