알파벳 순서 도움말

Question

여기에 문제가 있습니다. 데이터베이스에서 모든 제목을 가져 와서 알파벳 순서대로 나열하려고합니다. 즉, 어디에서 왔는지 알려주는 첫 번째 문자가 표시되어 더 명확하게 나타납니다.

A: 
Animal 
Alex 
B: 
Boo 
C: 
Crap 

이 사실이 내가 무엇을 사용하고, 완벽 작동합니다

<?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 
?> 

하지만 내 사업부의 끝에 도달 할 때 내가 이제 400 픽셀 높이를 가정 해 봅시다, 그래서 그것을 좋아하는 것, 그것은 새 열에서 시작 like :

A:        C: 

Alien       Crap 

B:        D: 

Boo       Dododododo 

저는 지금 정말로 우둔한 사람입니다. 그래서 어떤 도움이라도 정말 감사 할 것입니다!

덕분에 많이

Answer 1

것은 당신이 인쇄 된 라인을 계산하고 곱해해야합니다 당신의 정의 된 선 높이.

<?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 텍스트의 렌더링 된 높이를 알 수있는 방법을 제공하지 않습니다, 그래서 당신은 두 번째 열로 이동해야 할 때 알 수있는 방법은 없습니다.

과거에이 작업을 수행 한 방법은 예를 들어 'A'와 'B'가 첫 번째 열에 있고 'C'와 'D'가 두 번째 기둥.

CSS3는 정말 다중 열 레이아웃 지정하는 기능이있다, 압연지면 : 열이 아직 광범위하게 HTML에서 지원되지 않습니다으로 http://www.quirksmode.org/css/multicolumn.html