formatting html page output using css and php

Question

I write out a list of available players to my html page--however my list is almost 65 players long. I split the html page out using the following css

#right_side {
  float: right;
  margin: 20px 0px 20px 0px;
  width: 500px;
  height: 675px;
  border: 1px solid #CCCCCC;
  font-family: italic;
}

the PHP code loops through the list in the following way:

while($row = mysql_fetch_array($result)){
    echo "<li>".$row['FirstName'] . " " . $row['LastName']."</li>";
    echo"<br>";
    }

How do I break up the results so they are into 3 columns of 20 instead of one column of 60?

Answer 1

Add the following css

li 
{
      display:inline-block;
      width:30%;
}

This will give you

1 | 2 | 3

4 | 5 | 6

etc

See it here: http://jsfiddle.net/cmw7T/

Answer 2

try this one

php

 $total_num_each_column = mysql_num_rows($result) / 3;
    $count = 0;
        echo "<ul id='box'>";
        while($row = mysql_fetch_array($result)){
        if($count > $total_num_each_column) {
        echo "</ul> <ul id='box'>";
        }
        echo "<li>".$row['FirstName'] . " " . $row['LastName']."</li>";
        if($count > $total_num_each_column) {
        echo "</ul>";
        } 
        $count++;
        }

css

#box {
  float:left;
  margin-left:10px;
}

I hope it helps.