PHP For Loop Count in While Statement - php

Question

I'm trying to figure out the best solution on how to output my html with the php while counting up on a div class.
This is my function that prints news:
function post_news()
{
$post_news = $this->mysql->Query("SELECT * FROM news ORDER BY id DESC LIMIT 4");
while ($news_row = mysqli_fetch_array($post_news))
{
echo "<div class='column1'>
<div class='box'>
<h3>".$news_row['title']."</h3>
<p>".$news_row['content']."</p>
<a href='index.php?p=news&id=".$news_row['id']."' class='button button-small'>Read More</a> </div>
</div>";
}
}
What I am attempting is, where it shows <div class='column1'> I need it to count upward to class='column4'. When I attempt For loops or a second While loop I can sometimes get it to count but it always does a new line where I want these blocks to display side by side like normal.
So what is the best way to count up on my div class without it doing a line break after every block?

Answer 1

I assume that when you say 1 to 4 you want it to start over at 1 after 4. Just increment a counter and reset it when it reaches 4:
$num = 0;
while ($news_row = mysqli_fetch_array($post_news))
{
$num++;
echo "<div class='column{$num}'>
<div class='box'>
<h3>".$news_row['title']."</h3>
<p>".$news_row['content']."</p>
<a href='index.php?p=news&id=".$news_row['id']."' class='button button-small'>Read More</a> </div>
</div>";
if($num == 4) { $num = 0; }
}
Or actually, you use LIMIT 4 in the query so you don't really need the if statement that resets it to 0, as the loop will only iterate 4 times.

Answer 2

A pure html workaround to this would be to have the code like so:
<div class='column1'>
...
</div><div class='column2'>
..
</div>
But because you're echoing it that's not going to work. Another thing you can do is specify an inline-block css property for those columns. If you're using bootstrap you can just use col-xs-3 so that you can have 4 even columns.
If not, instead you're going to have to specify each of those classes to be width:25%
So to wrap up, in css:
.col{
width:25%;/*probably going to have make responsive for screen width*/
display:inline-block;/*or float:left, whichever*/
}
And in php/html:
...
echo "<div class='column1 col'>
<div class='box'>
<h3>".$news_row['title']."</h3>
<p>".$news_row['content']."</p>
<a href='index.php?p=news&id=".$news_row['id']."' class='button button-small'>Read More</a> </div>
</div>";
...
Hope that helps.