Есть простой список (меню), его нужно разбить на 4 не равномерных колонки, никак немогу решить ету задачу.
Нужно примерно добиться такого результата (с лева на право):
Колонка 1 - пункты меню с 1 до 6
Колонка 2 - пункты меню с 7 до 10
Колонка 3 - пункты меню с 11 до 13
Колонка 4 - пункты меню с 14 до 18
Целый день сегодня пробую разные варианты, и ничего не хочет работать, помогите пожалуйста если есть какие-то идеи как реализовать такой пример на css
Код |
---|
<ul class="sub-menu"> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 1</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 2</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 3</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 4</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 5</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 6</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 7</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 8</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 9</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 10</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 11</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 12</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 13</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 14</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 15</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 16</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 17</a></li> <li id="menu-item" class="menu-item-type"><a href="http://........">Пункт 18</a></li> </ul> |
Нужно примерно добиться такого результата (с лева на право):
Колонка 1 - пункты меню с 1 до 6
Колонка 2 - пункты меню с 7 до 10
Колонка 3 - пункты меню с 11 до 13
Колонка 4 - пункты меню с 14 до 18
Целый день сегодня пробую разные варианты, и ничего не хочет работать, помогите пожалуйста если есть какие-то идеи как реализовать такой пример на css
Изменено:
Chmil - 6 Ноября 2020 00:00