Адключыце спагадлівасць Bootstrap, зафіксаваўшы шырыню кантэйнера і выкарыстоўваючы першы ўзровень сістэмы сеткі. Прачытайце дакументацыю для атрымання дадатковай інфармацыі.
Звярніце ўвагу на адсутнасць <meta name="viewport" content="width=device-width, initial-scale=1">, які адключае аспект маштабавання сайтаў на мабільных прыладах. Акрамя таго, мы скінулі шырыню нашага кантэйнера і змянілі панэль навігацыі, каб прадухіліць згортванне, і ў асноўным усё гатова.
Папярэджваем, што кампанент навігацыйнай панэлі тут даволі складаны, таму што стылі для яго адлюстравання даволі спецыфічныя і падрабязныя. Перавызначэнні, каб пераканацца, што адлюстраванне стыляў працоўнага стала не такое прадукцыйнае або гладкае, як хацелася б. Памятайце, што пры выкарыстанні панэлі навігацыі на аснове гэтага прыкладу могуць узнікнуць патэнцыйныя праблемы.
Макеты, якія не рэагуюць, падкрэсліваюць ключавы недахоп фіксаваных элементаў. Любы фіксаваны кампанент, напрыклад фіксаваная навігацыйная панэль, не будзе пракручвацца, калі акно прагляду становіцца ўжо, чым змесціва старонкі. Іншымі словамі, улічваючы шырыню кантэйнера, які не рэагуе, у 970 пікселяў і акно прагляду ў 800 пікселяў, вы патэнцыйна схаваеце 170 пікселяў кантэнту.
Гэта немагчыма абыйсці, бо гэта паводзіны браўзера па змаўчанні. Адзінае рашэнне - спагадны макет або выкарыстанне нефіксаванага элемента.