Как подстроить два fixed-меню под колонки в Bootstrap, разделённые в пропорции 8/4?

Question

[Павел Иванов]

У меня есть два меню, которые прилипают к топу во время скроллинга страницы. Но поскольку они fixed, то они сползают пропорционально и закрывают часть соседней колонки.

Как сделать так, чтобы они делились в пропорции col-mx-8 / col-mx-4 в зависимости от разрешения экрана? 33/67 процентов не вариант, не работает.

Answer 1

[Alexander Sydorenko]

Может так?

jsbin.com/vanevimawu/2/edit?html,css,js,output

Comments

[Иван Новиков]

Взял твой исходный код ^^ и переделал чуть чуть jsbin.com/rekiqecoji/1/edit?html,css,js,output

Answer 2

[Иван Новиков]

<nav class="col-lg-12">
    <div class="col-mx-8 col-sm-8 col-sx-8">
        <!--Ваше меню-->
    </div>
    <div class="col-mx-4 col-sm-4 col-sx-4">
        <!--Ваше меню 2-->
    </div>
</nav>

Такое не помогает?
Взял от сюда Документация Bootstrap 3

Comments

[Павел Иванов]

У меня сложнее:
и то же самое для меню sticky-right.
Когда ты скроллишь страницу, в js вычисляется разница между window.top и div.top и если она <= 0, то меню из static становится fixed путём добавления класса. Если > 0, то класс с fixed удаляется.

[Павел Иванов]

< div id="sticky-anchor-left" >< /div >< div id="sticky-left" >Меню Bootstrap < / div >

[Иван Новиков]

@paus: посмотри jsbin.com/rekiqecoji/1/edit?html,css,js,output

[Иван Новиков]

@paus: только экран просмотра сделай побольше. я не адаптировал под маленькие экраны