Resultater fortsætter ud af ul'en

Kære udviklere!,

Sidder og lejer med groupering af kategorier efter alfabetisk rækkefølge, naturligvis ud fra resultater som jeg har i min database. Mit problem er at jeg har lavet det i <ul> og <li> -tags. Og det virker skam. Problemet er at jeg har givet min ul en bestemt størrelse, og forventer at resten af resultaterne så fortsætter mod højre.

Screenshot

PHP/HTML

 $result .= "<ul class=\"fancyList\">";
                 
                 $prevLabel = null;
                 $numberOfNewResults = 0;
                 
                 $cnt = count($array);
                 
                 foreach($array as $row) {
                     $currLabel = strtoupper(substr($row['category_name'], 0, 1));
                     $category = "<a href=\"./browse.php?cat_id=".$row["ID"]."\">" . ucfirst($row['category_name']) . "</a><br />";
                     
                     if ($currLabel !== $prevLabel) {
                         if($numberOfNewResults != 0) $result .= "</li>";
                         
                         $result .= "<li>";
                         
                         $result .= "<strong>" . $currLabel . "</strong><br />";
                         $prevLabel = $currLabel;
                         
                         $result .= $category;
                         
                         $numberOfNewResults++;
                     } else
                     {
                         $result .= $category;
                     }
                     
                     if($numberOfNewResults == $count) $result .= "</li>";
                 }
 
                 $result .= "</ul>";
                 
                 return $result;

CSS

 /* fancyList */
 .fancyList {
     width: calc(100% - 10px);
     display: block;
     float: left;
     list-style: none;
     list-style-type: none;
     font-family: Arial;
     height: 400px;
     background: Red;
     white-space: normal;
     word-wrap: break-word;
 }
 
 .fancyList li {
     display: block;
     margin-bottom: 20px;
 }
 
 .fancyList strong {
     font-size: 28px;
 }

Ved ikke hvordan jeg kan få mine li'er til at fortsætte mod højre, så de kan fylde boksen ud.

På forhånd tak.