pagination content - pagination

Question

I am trying to do pagination for my forum. I am trying to get the results to show from the db, although everything is everywhere.
here is my code:
<!-- start with the table -->
<table width="100%" border="0" align="center" cellpadding="3" cellspacing="1" bgcolor="#CCCCCC">
<tr>
<td width="53%" align="center" bgcolor="#E6E6E6" style="padding:5px;"><strong>Topic / Thread Starter</strong></td>
<td width="15%" align="center" bgcolor="#E6E6E6" style="padding:5px;"><strong>Replies/Views</strong></td>
<td width="13%" align="center" bgcolor="#E6E6E6" style="padding:5px;"><strong>Last Post By</strong></td>
</tr>
<div id="p1" class="pagedemo _current" style="">
<?php
$sql="SELECT * FROM forum ORDER BY datetime DESC";
$result=mysql_query($sql);
$i = 1;
$z = 1;
while($rows = mysql_fetch_array($result)){ // Start looping table row
if(($i % 4) != 0)
{ ?>
<tr>
<td bgcolor="#FFFFFF" style="padding:5px;"><a class="normal" href="view_topic.php?id=<? echo $rows['id']; ?>"><? echo $rows['topic']; ?></a><br /><span style="color:#666; font-size:12px;">Started By <?php echo "<a class='normal' href='http://www.example.com/view_profile.php?user=".getID($rows[username])."'>"; ?> <? echo $rows['username']; ?></a></span></td>
<td align="center" bgcolor="#FFFFFF">Replies: <? echo $rows['reply']; ?><br />Views: <? echo $rows['view']; ?></td>
<td align="center" background="http://example.com/images/forum_fade_bckg.png"><span style="color:#666; font-size:12px;">
<?php echo "<a class='normal' href='http://www.example.com/view_profile.php?user=".getID($rows[lastPoster])."'>"; ?> <?php echo $rows['lastPoster']; ?></a><br /><?php $date = substr($rows['datetime'],0,12);
if($date == date("M d, Y")) {
echo "Today, " . substr($rows['datetime'],-8);
} else {
echo $rows['datetime'];
}?> </span></td>
</tr>
<?php
// do whatever for the page... (this is inside the div)
$message = $row['message'];
echo $i . " " . $message. "<br>";
$i+=1;
}
else
{
$z+=1;
// GET ONLY NUMBERS HERE THAT ARE DIVISIBLE BY 4!!!!
// this is the end of the starting page, and the begining of the next page
echo '<br>---end---</div>
<div id="p'.$z.'" class="pagedemo" style="display:none;">---start---<br>NEXT PAGE!!!!!!!'; //
}
}
?>
</div>
The results, instead of staying in the div, are actually below the div. when I take out everything b/w the <tr> and </tr>, it all fits into the div. What am I doing wrong?

Answer 1

If you view the source of the page the issue should be apparent. I see a few mistakes that could be the problem.
The TABLE at the top of the snippet ends the TR tag then a DIV starts. A DIV should only reside within a TD, TH or outside the TABLE. Also in the snippet you provided there is no ending table tag. With all the other issues that is probably the one that is messing the browser up.
Please adjust structure to be similar to this:
<div>...</div>
<table>
<tr>
<td>Some tags in here(A, DIV, SPAN, etc.)</td>
</tr>
<tr>
<td>...</td>
<td>...</td>
</tr>
</table>
<div>...</div>
Also it would be worthwhile to migrate certain attributes to css properties in the style tag. For example the background, bgcolor, align, and width attributes in your snippet.
Sorry if that does not fix the issue its hard to debug without being able to see the issue.