DerRed DerRed - 21 days ago 6
CSS Question

Name below picture

Sitting here and following a tutorial, but there's something I'd like to get changed.
I got pictures up on my front site of my users, when I hover over their picture then I can see their user name.

Would like to have their user name stood below their picture instead.
Any one know how to do that.?

<?php
include_once("php_includes/check_login_status.php");

$sql = "SELECT username, avatar FROM users WHERE avatar IS NOT NULL AND activated='1' ORDER BY RAND() LIMIT 32";
$query = mysqli_query($db_conx, $sql);
$userlist ="";
while ($row = mysqli_fetch_array($query, MYSQLI_ASSOC)) {
$u = $row["username"];
$avatar = $row["avatar"];
$profile_pic = 'user/'.$u.'/'.$avatar;
$userlist .= '<a href="user.php?u='.$u.'" title="'.$u.'"><img src="'.$profile_pic.'" alt="'.$u.'" style="width:100px; height:100px; margin:10px;"></a>';
}
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta charset="UTF-8">
<head>
<link rel="stylesheet" href="style/style.css">
</head>
<body>
<?php include_once("template_pageTop.php"); ?>

<div id="pageMiddle">
<?php echo $userlist; ?>
</div>

<?php include_once("template_pageBottom.php"); ?>

</body>
</html>

Answer

you can use the following code. just a few adjustment to the while loop

while ($row = mysqli_fetch_array($query, MYSQLI_ASSOC)) {
$u = $row["username"];
$avatar = $row["avatar"];
$profile_pic = 'user/'.$u.'/'.$avatar;
$userlist .= '<a href="user.php?u='.$u.'" title="'.$u.'"><img   
src="'.$profile_pic.'" alt="'.$u.'" style="width:100px; height:100px;  
margin:10px;"></a><br><h3>'.$u.'</h3>';
}