PHP affecting column layout - php

Question

The structure of the main body of my page is constructed of three columns, these columns are generated by MYSQL data and then formulated in to three columns using PHP.
Below is PHP code and the layout which provides the three columns. The problem which I have is that if the data provides a layout two columns wide then everything is fine and it looks like this.
http://goo.gl/TDKI2J
However if the data provides a layout three columns wide then it looks like this.
http://goo.gl/0uqPvX
I think the problem is the div tag after the on the third column, but not sure of the best way to fix the issue.
Here is the code.
<?php $columnSelector = 0; // define a column selector ?>
<?php while($row = mysql_fetch_array($result)) :?>
<?php if ($columnSelector == 0): ?>
<div class="row-fluid">
<article class="span4 mid">
<div class="img">
<img src="images/<?php echo $row['image']; ?>" alt="post4" />
<div class="overlay"></div>
</div>
<div class="info">
<p class="tags">
<?php echo $row['event_type']; ?>
<?php echo $row['location']; ?>
</p>
<h1><?php echo $row['event_title']; ?></h1>
<p class="details"> | </p>
<p class="text">
<?php echo $row['event_details_short']; ?>
</p>
</div>
</article>
<?php elseif ($columnSelector == 1): ?>
<article class="span4 mid">
<div class="img">
<img src="images/<?php echo $row['image_link']; ?>" alt="post4" />
<div class="overlay"></div>
</div>
<div class="info">
<p class="tags">
<?php echo $row['event_type']; ?>
<?php echo $row['location']; ?>
</p>
<h1><?php echo $row['event_title']; ?></h1>
<p class="details"> <?php echo $row['date']; ?> | <?php echo $row['posted_by']; ?></p>
<p class="text">
<?php echo $row['event_details_short']; ?>
</p>
</div>
</article>
<?php elseif ($columnSelector == 2): ?>
<article class="span4 mid">
<div class="img">
<img src="images/<?php echo $row['image_link']; ?>" alt="post4" />
<div class="overlay"></div>
</div>
<div class="info">
<p class="tags">
<?php echo $row['event_type']; ?>
<?php echo $row['location']; ?>
</p>
<h1><?php echo $row['event_title']; ?></h1>
<p class="details"> <?php echo $row['date']; ?> | <?php echo $row['posted_by']; ?></p>
<p class="text">
<?php echo $row['event_details_short']; ?>
</p>
</div>
</article>
</div>
<?php endif; ?>
<?php $columnSelector++; // advance to the next row?>
<?php $columnSelector %= 3; // reset to zero every third event?>
<?php endwhile; ?>

Answer 1

It is probably the if statement don't let the code below to shown.
This line : <?php if ($columnSelector == 0): ?>

Answer 2

OK, solved it, the problem was the last tag here:
</article>
</div>
It was needed for when only one or two columns show but not for the third and so i replaced it with this.
</div>
</article>
<?php if ($columnSelector == 1){ ?>
</div>
<?php } ?>
<?php endif; ?>
And so now when there is three columns the div doesn't show and the layout is correct.