ozoro, есть свойство
columns, которое позволяет выводить элементы в столбики.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.column-list {
padding: 0 10px;
border: 1px solid #000;
list-style-position: inside;
-moz-column-count: 3;
-webkit-column-count: 3;
column-count: 3;
}
.column-list li ul, .column-list li {
-webkit-column-break-inside: avoid;
page-break-inside: avoid;
break-inside: avoid;
}
</style>
</head>
<body>
<ul class="column-list">
<li>Пункт #1</li>
<li>Пункт #2</li>
<li>Пункт #3</li>
<li>Пункт #4</li>
<li>Пункт #5</li>
<li>Пункт #6</li>
<li>Пункт #7
<ul>
<li>Пункт #7.1</li>
<li>Пункт #7.2</li>
<li>Пункт #7.3</li>
<li>Пункт #7.4</li>
<li>Пункт #7.5</li>
<li>Пункт #7.6</li>
<li>Пункт #7.7</li>
<li>Пункт #7.8</li>
<li>Пункт #7.9</li>
</ul>
</li>
<li>Пункт #8
<ul>
<li>Пункт #8.1</li>
<li>Пункт #8.2</li>
<li>Пункт #8.3</li>
</ul>
</li>
<li>Пункт #9</li>
<li>Пункт #10</li>
<li>Пункт #11
<ul>
<li>Пункт #11.1</li>
<li>Пункт #11.2</li>
<li>Пункт #11.3</li>
<li>Пункт #11.4</li>
<li>Пункт #11.5</li>
<li>Пункт #11.6</li>
</ul>
</li>
<li>Пункт #12</li>
<li>Пункт #13</li>
<li>Пункт #14</li>
<li>Пункт #15</li>
<li>Пункт #16</li>
<li>Пункт #17</li>
<li>Пункт #18</li>
<li>Пункт #19</li>
<li>Пункт #20</li>
<li>Пункт #21</li>
<li>Пункт #22</li>
<li>Пункт #23</li>
<li>Пункт #24</li>
<li>Пункт #25</li>
<li>Пункт #26</li>
<li>Пункт #27</li>
<li>Пункт #28</li>
<li>Пункт #29</li>
<li>Пункт #30</li>
<li>Пункт #31</li>
<li>Пункт #32</li>
<li>Пункт #33</li>
<li>Пункт #34</li>
<li>Пункт #35</li>
<li>Пункт #37</li>
<li>Пункт #38</li>
</ul>
</body>
</html>