line break after each row retrieval - php

Question

I need to add a line break after each row retrieved;
I hav tried adding in every possible way.. No luck..
while ($line = mysql_fetch_array($result))
{
?>
<style>
.whiteBackground { background-color:#F5ECCE;float:left;}
.grayBackground { background-color:#CED8F6; float:right;}
.date { font-size:10px; color:#627d79;float:right}
</style>
<?php
$sender=$line["sender"];
$classy=($sender == $uid)? 'whiteBackground': 'grayBackground';
$q=mysql_query("select * from users where u_id='$sender'");
$row=mysql_fetch_array($q);
$receiver=$row['firstname'];
//if($receiver!= $line["receiver"])
$msg = $msg . "<tr class='$classy'>" .
"<td>" . $receiver . ": </td>" .
"<td>" . $line["msg"] . "</td>"."<td class='date'>" . $line["chattime"] . "</td></tr>";
}
$msg=$msg . "</table>";
echo $msg;
I need to add a break after each sender+msg+time.//like in a usual chat.

Answer 1

Your problem come from float declarations. They are useless in your code :
.whiteBackground { background-color:#F5ECCE;float:left;}
.grayBackground { background-color:#CED8F6; float:right;}
.date { font-size:10px; color:#627d79;float:right}
Remove them and it will work as expected.
You don't need them in your code if you use <table> and <tr>. Default behaviour of <tr> is to create a new "line" each time you add it, but with adding float you're breaking this behaviour.
Also, follow #bulforce recommendation to move your CSS before loop : your code add it as many time you have messages in your document (if you have 10 messages, css declarations will be added 10 times).
<style type="text/css">
.whiteBackground { background-color:#F5ECCE; }
.grayBackground { background-color:#CED8F6; }
.date { font-size:10px; color:#627d79; }
</style>
<?php
while ($line = mysql_fetch_array($result))
{
// ...
}
?>

Answer 2

Just try to add a <tr><td colspan="3"> </td></tr> after </tr> inside the while loop

Answer 3

First consider moving the css declaration before the loop, there is no point to have it in the loop body.
Second the second query in the loop should also be moved before the loop and rework this a bit.
Now to your question, one option would be to change the table with divs and spans.. something like so:
<div class="message-row">
<span class="message-user">Name</span>
<span class="message-text">Message</span>
</div>
Then style as you did before, and add margin-bottom: 15px; to the message-row definition.

Answer 4

before while
$msg="<table>";
Inside while
$msg.= "<tr class='$classy'>" in place of $msg = $msg . "<tr class='$classy'>"
Will work for you.

Answer 5

I solved it by replacing table tags with div tags.
Thnku #bulforce; now I will completely follow ur recommendations.
$msg="<div>";
$date_temp="nil";
while ($line = mysql_fetch_array($result))
{
?>
<style>
.whiteBackground { background-color:#F5ECCE;float:left;}
.grayBackground { background-color:#CED8F6; float:right;}
.date { font-size:10px; color:#627d79;float:right}
</style>
<?php
$sender=$line["sender"];
$classy=($sender == $uid)? 'whiteBackground': 'grayBackground';
$q=mysql_query("select * from users where u_id='$sender'");
$row=mysql_fetch_array($q);
$receiver=$row['firstname'];
//if($receiver!= $line["receiver"])
/*if($date_temp!=$line["chatdate"]){
$date_temp=$line["chatdate"];
$msg=$msg.$line["chatdate"];
}*/
$msg = $msg . "<div class='$classy'>" . $receiver.": " . $line["msg"] ."<div class='date'>" . $line["chattime"] . "</div></div></br></br>";
}
$msg=$msg . "</div>";
echo $msg;