Есть два блока box2 и box3 с шириной в 100% и автоматической высотой в них есть ссылки в виде обычных букв, мне нужно сделать что бы на каждой строке в этих блоках было по 8 букв и каждая строка была на всю ширину браузера
<div class="box2">
<ul><li><a class="anchor" href="#anchor_link_1">А</a> <a class="anchor" href="#anchor_link_2">Б</a> <a class="anchor" href="#anchor_link_3">В</a> <a class="anchor" href="#anchor_link_4">Г</a> <a class="anchor" href="#anchor_link_5">Д</a> <a class="anchor" href="#anchor_link_6">Е</a> <a class="anchor" href="#anchor_link_7">Ж</a> <a class="anchor" href="#anchor_link_8">З</a> <a class="anchor" href="#anchor_link_9">И</a> <a class="anchor" href="#anchor_link_10">К</a> <a class="anchor" href="#anchor_link_11">Л</a> <a class="anchor" href="#anchor_link_12">М</a> <a class="anchor" href="#anchor_link_13">Н</a> ​<a class="anchor" href="#anchor_link_14">О</a> <a class="anchor" href="#anchor_link_15">П</a> <a class="anchor" href="#anchor_link_16">Р</a> <a class="anchor" href="#anchor_link_17">С</a> <a class="anchor" href="#anchor_link_18">Т</a> <a class="anchor" href="#anchor_link_19">У</a> <a class="anchor" href="#anchor_link_20">Ф</a> <a class="anchor" href="#anchor_link_21">Х</a> <a class="anchor" href="#anchor_link_22">Ч</a> <a class="anchor" href="#anchor_link_23">Ш</a> <a class="anchor" href="#anchor_link_24">Э</a></li></ul>
</div>
.box2 {
display: inline-block;
vertical-align: top;
width: 100%;
height:auto;
}
.box3 {
display: inline-block;
vertical-align: top;
width: 100%;
height:auto;
}
.box2 ul{
list-style-type: none;
width:12.3%;
border: 1px solid #2ecc71;
}
.box2 li{
width:12.3;
font-family: Arial, Helvetica, sans-serif;
font-size: 15px;
color: #000;
padding: 16px 26px;
display: inline-block;
text-decoration: none;
border-radius: 3px;
border: 1px solid #2ecc71;
}
.reklama{
position: absolute;
left: 0;
bottom: 0;
width: 100%;
}
.reklama img{
width:100%;
}