0

Я пытаюсь создать меню нижнего колонтитула с надписью для перетаскивания и полной ширины для мобильных устройств с Bootstrap 3. Я уже создаю выпад с помощью css и делаю суб-навигация выравнивается влево (я не знаю, если это лучший способ, но он работает). Я пробовал много способов и проверял множество примеров, но я не могу понять, как сделать суб-навигационная панель покрывает всю ширину экрана. Вот мой пример работы в этом Bootply http://www.bootply.com/7wy0Oten9mПодкатегория полной ширины Bootstrap 3

ответ

0

Проблема с вашим кодом заключается в том, что все, что вы установили, все классы col-xs-2 определяют ширину вашего выпадающего списка. Решение здесь - попрощаться с Bootstrap для немного.

Идея:

  1. Footer -> Col-хз-12 (полная ширина)

  2. Поместите все 5 частей меню в нем (все имеют класс «кнопка-footer- мобильный ") и установить их ширину 16.66667% (который был ширина 2-COL)

  3. дать middlemenu другой класс и установить его на 33.33333% (ширина 4-COL)/класс является middlemenu в моем примере/

  4. Поплавок «кнопка-сноска-мобиль» класс влево и установите его запас 0.

Таким образом, у вас есть один и тот же макет, но теперь выпадающие окна могут иметь ширину в 100% ,

Вы можете увидеть рабочий bootply здесь: http://www.bootply.com/lyLNGBDZ68#

Я надеюсь, что это помогло вам и мой ответ ясны и понятны,

Эндрю

+0

Спасибо за вашу помощь Эндрю! Ответ был очень ясным и простым в применении. – alejuu

Смежные вопросы