<style>
    .boxed {
  border: 5px solid blue;
  margin-left:30px; /* half of width */
  margin-top:10px;  /* half of height */
  /*top:50%;
  left:50%; */
  height: 120px;
  width: 200px;
  border-style: double;
  /*text-overflow: hidden; */
  text-overflow: ellipsis;
  float:left;
}
.boxed:hover{
    height: 150px;
  width: 250px;
  -moz-box-shadow: 0 0 10px #ccc;
  -webkit-box-shadow: 0 0 20px #ccc;
  box-shadow: 0 0 20px #888888;
  border-style: double;
  /*text-overflow: hidden;*/
  text-overflow: ellipsis;
}
</style>

<?php
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = '';
$selection = "ORDER BY  id ASC";
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
  die('Could not connect: ' . mysql_error());
}

$selection=isset($_GET['sort']) ? $_GET['sort'] : "";
if($selection == "1"){$selection="ORDER BY id DESC";}
else if($selection == "2"){$selection="ORDER BY id ASC";}


$sql="SELECT id, threadName, message FROM threads ";
$sql.=$selection;

mysql_select_db('threads');
$retval = mysql_query( $sql, $conn );
if(! $retval )
{
  die('Could not get data: ' . mysql_error());
}
while($row = mysql_fetch_array($retval, MYSQL_ASSOC))
{
  $id = $row['id'];
  $threadName = $row['threadName'];
  $message = $row['message'];
  echo "<div class='boxed'><center>".$threadName."<br>".$message."</center></div>";
}
?>