Tanya von Degurechaff
Tanya von Degurechaff

Reputation: 173

Split 1 Loop Into 2 Column in PHP

I made tables using foreach loop, it looks like this

enter image description here

How do i split it into two column like this:

enter image description here

Upvotes: 0

Views: 2592

Answers (3)

symlink
symlink

Reputation: 12209

Print it out simply in PHP:

<div class="grid">
<?php
    foreach($tables as $table){
        echo "<div>".$table."</div>";
    }
?>
</div>

Yields:

<div class="grid">
    <div>Table Code</div>
    <div>Table Code</div>
    <div>Table Code</div>
    <div>Table Code</div>
</div>

Then style with CSS Grid:

.grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.grid > div{
    border: blue 3px dashed;
    padding: 25px;
}
<div class="grid">
    <div>Table Code</div>
    <div>Table Code</div>
    <div>Table Code</div>
    <div>Table Code</div>
</div>

Upvotes: 2

MH2K9
MH2K9

Reputation: 12039

With the help of for loop, increasing by 2. This also reduce the number of iteration.

PHP

$arr = range(1, 10);
echo '<table>';
for ($i = 0; $i < count($arr); $i += 2)
{
    echo '<tr>';
    echo "<td>{$arr[$i]}</td>";
    echo "<td>{$arr[$i + 1]}</td>";
    echo '</tr>';
}
echo '</table>';

CSS:

td {
    border: 2px solid #000;
}

Upvotes: 1

Obsidian Age
Obsidian Age

Reputation: 42314

Use modulo to conditionally split your elements into two different groups:

<?php
for ($i = 0; $i < 10; $i++) {
    if ($i % 2 == 0) {
        echo "<div class='left'>$i</div>";
    } else {
        echo "<div class='right'>$i</div>";
    }
}
?>

And then use CSS to float the columns next to each other:

.left {
  float: left;
}
.right {
  float: right;
}
.left, .right {
  width: 50%;
}

Upvotes: 2

Related Questions