PHP数组在样式化后变为垂直而不是水平

我有一个字母数组。在我添加样式后，数组从水平变为垂直。

$alphabetical_array = range('a','z');
function AddLinks($letter)
{
$title = strtoupper($letter);
$a = "<a href='alpha_search.php?letter=".$letter."' class='alphabtn'><font color='#FFFFFF'>".$title."</font></a>";
return($a);
}
$format_array = array_map("AddLinks", $alphabetical_array);
echo implode($format_array);

下面是css:

.alphabtn {
    max-width:10px;
    text-decoration: none;
    position: relative;
    padding: 5px ;
    text-align:left;
    clear: both; 
    text-indent:0;
    display: block;
    font: bold 12px/14px Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    color: #fff;
    border-radius: 4px;
    border: 1px solid #391b61;
    text-shadow: 1px 1px 1px #ccc;
    background: -moz-linear-gradient(top, #864fd3 0%, #553285 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#864fd3), color-stop(100%,#553285));
    background: -webkit-linear-gradient(top, #864fd3 0%,#553285 100%);
    background: -o-linear-gradient(top, #864fd3 0%,#553285 100%);
    background: -ms-linear-gradient(top, #864fd3 0%,#553285 100%);
    background: linear-gradient(to bottom, #864fd3 0%,#553285 100%);
    -pie-background: linear-gradient(#864fd3, #553285);
    -webkit-box-shadow: inset 0px 1px 1px 1px #a55aff;
    box-shadow: inset 0px 1px 1px 1px #a55aff;
    behavior: url(../login/_ui/js/PIE.htc);
}.alphabtn:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #553285), color-stop(1, #864fd3) );
    background:-moz-linear-gradient( center top, #553285 5%, #864fd3 100% );
    background: -moz-linear-gradient(top, #553285 0%, #864fd3 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#553285', endColorstr='#864fd3');
    background-color:#553285;
}.alphabtn:active {
    position:relative;
    top:1px;
}