Aide de l'ordre alphabétique

Question

J'ai un problème ici, j'essaie d'obtenir tous les titres de ma base de données et de les lister dans l'ordre alphabétique avec la première lettre indiquant où nous en sommes, pour être plus clair:

A: 
Animal 
Alex 
B: 
Boo 
C: 
Crap 

en fait, ce que je l'utilise, et il fonctionne parfaitement:

<?php 

$conn = mysql_connect('localhost','user','pw') or die(mysql_error()); 
$db = mysql_select_db('dbname') or die(mysql_error()); 

$sql = "select * from games order by title"; 
$result = mysql_query($sql, $conn) or die(mysql_error()); 

while ($list = mysql_fetch_array($result)) { 

$letter = strtoupper(substr($list['title'],0,1)); 

if ($letter != $prev_row) { 
echo "<br><b><u>$letter</u></b><br>"; 
} 
echo '<li><a href="/play/id/' . $list['id'] . '/">'.$list['title'].'</a></li>'; 

$prev_row = $letter; 
} // end while 
?> 

Mais je voudrais ainsi, quand il atteint la fin de mon div, disons que 400px de hauteur, il commence une nouvelle colonne comme:

A:        C: 

Alien       Crap 

B:        D: 

Boo       Dododododo 

Je suis vraiment désemparé pour le moment, donc toute aide serait vraiment appréciée!

Merci beaucoup

Answer 1

Comme colonnes ne sont pas encore largement pris en charge en HTML vous devrez compter les lignes imprimées et les multiplier par votre hauteur de ligne définie.

<?php 

$conn = mysql_connect('localhost','user','pw') or die(mysql_error()); 
$db = mysql_select_db('dbname') or die(mysql_error()); 

$sql = "select * from games order by title"; 
$result = mysql_query($sql, $conn) or die(mysql_error()); 
echo "<div style='float:left;height:400px;width:150px;'>"; 
$current_height = 0; 
$line_height = '12px'; // replace by your value 

while ($list = mysql_fetch_array($result)) { 

$letter = strtoupper(substr($list['title'],0,1)); 

if ($current_height >= (400 - 2 * (int) $line_height)) { 
echo "</div><div style='float:left;height:400px;width:150px;'>"; 
$current_height = 0; 
} 
if ($letter != $prev_row) { 
echo "<br><b><u>$letter</u></b><br>"; 
$current_height += (int) $line_height; 
} 
echo '<li><a href="/play/id/' . $list['id'] . '/">'.$list['title'].'</a></li>'; 
$current_height += (int) $line_height; 

$prev_row = $letter; 
} // end while 
echo "</div>"; 
?> 

Answer 2

HTML ne fournit aucun moyen de dire la hauteur du texte rendu, donc il n'y a aucun moyen de savoir quand vous devez passer à la deuxième colonne. Comment je l'ai fait dans le passé est juste pris une décision arbitraire que, par exemple, «A» et «B» seront dans la première colonne, et «C» et «D» sont dans la seconde colonne.

Lorsque CSS3 devient vraiment rouler, il a la possibilité de spécifier une mise en page à plusieurs colonnes: http://www.quirksmode.org/css/multicolumn.html