Не вмещается длинное меню в шаблоне Default (версия 11)?

вопрос

Очень понравился новый шаблон Default в версии 11, но, как оказалось, если левое меню навигации имеет достаточно большое количество строк (длинное меню), то часть этого меню не вмещается в экран, а при просмотре на больших мониторах меню не прокручивается. Можно ли это исправить без каких-либо сложных манипуляций?

Ответил: Grawick

Вынести блок

Показать / Скрыть текст

<div id="cat_menu">
                            <nav class="cat_menu">
                                <div class="cat_menu__tm">{include file="modules/topmenu.tpl"}</div>
                                {include file="modules/catmenu.tpl"}
                            </nav>
                            <div class="soc_links">
                                <a class="soc_vk" href="#" title="Мы вКонтакте">
                                    <svg class="icon icon-vk"><use xlink:href="#icon-vk"></use></svg>
                                </a>
                                <a class="soc_tw" href="#" title="Мы в Twitter">
                                    <svg class="icon icon-tw"><use xlink:href="#icon-tw"></use></svg>
                                </a>
                                <a class="soc_fb" href="#" title="Мы в Facebook">
                                    <svg class="icon icon-fb"><use xlink:href="#icon-fb"></use></svg>
                                </a>
                                <a class="soc_gp" href="#" title="Мы в Google">
                                    <svg class="icon icon-gp"><use xlink:href="#icon-gp"></use></svg>
                                </a>
                            </div>
                        </div>

за пределы header и убрать стиль float: left у .mid side

Будет тут -

Показать / Скрыть текст


            
                    </div>
                </div>
            </header>
            <div id="cat_menu">
                            <nav class="cat_menu">
                                <div class="cat_menu__tm">{include file="modules/topmenu.tpl"}</div>
                                {include file="modules/catmenu.tpl"}
                            </nav>
                            <div class="soc_links">
                                <a class="soc_vk" href="#" title="Мы вКонтакте">
                                    <svg class="icon icon-vk"><use xlink:href="#icon-vk"></use></svg>
                                </a>
                                <a class="soc_tw" href="#" title="Мы в Twitter">
                                    <svg class="icon icon-tw"><use xlink:href="#icon-tw"></use></svg>
                                </a>
                                <a class="soc_fb" href="#" title="Мы в Facebook">
                                    <svg class="icon icon-fb"><use xlink:href="#icon-fb"></use></svg>
                                </a>
                                <a class="soc_gp" href="#" title="Мы в Google">
                                    <svg class="icon icon-gp"><use xlink:href="#icon-gp"></use></svg>
                                </a>
                            </div>
                        </div>
            <!-- / Header -->
            <div class="conteiner">
                <div class="midside">
                    <div class="content_top">
                    {include file="modules/carousel.tpl"}


/* 158 строка по стандарту */
.midside {
    /* float: left; */
    padding: 0 350px 0 13%;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

у блока cat_menu убрать отступ сверху


/* 399 строка по стандарту */
@media only screen and (min-width: 601px)
#cat_menu {
    float: left;
    width: 13%;
    position: relative;
    z-index: 10;
    /* margin-top: 105px; */
}

Fancybox.bind("[data-highslide]", { groupAttr: 'data-highslide', idle:2000, Thumbs: false, caption: (fancybox, slide) => { if( slide.thumbEl && slide.thumbEl.alt ) { return slide.thumbEl.alt } } });

2 комментария

Юзер

Jackson_X - 2016-08-1219 августа 2016 15:29 - #57985

Спасибо за ответ, попробовал так сделать, но теперь правый сайдбар улетает ниже центрального:(

Jackson_X - 2016-08-1219 августа 2016 17:27 - #57997

Поставил код правого сайдбара {include file="modules/rightside.tpl"} сразу за кодом левого и все заработало как надо!
Спасибо, Grawick, Вы очень помогли!

Не вмещается длинное меню в шаблоне Default (версия 11)?

Ответил: Grawick

2 комментария

Похожие вопросы

Горизонтальное меню со своим горизонтальным подменю для разных разделов

Сделать меню в два ряда

Выпадающее меню или блок

Меню в две колонки

Не получается левое меню переместить вправо

Помощь с меню DLE

Где отредактировать меню?

Выезжающае меню в мобильной версии DLE

Помогите сделать выпадающее меню

Как сделать выпадающее меню в выпадающем меню?