Блочное меню <<прыгает>> при открытии/скрытии меню вкладок/инструментов в смартфоне CSS
Уже 3 день пытаюсь найти ответ на данный вопрос, но как видите безуспешно :). В общем, суть проблемы: при входе на сайт со смартфона (проверялся только android), с браузера chrome мы попадаем на главную страничку(она делалась без скроллинга вниз). Тут всё ок по началу, но при открытии <<панели инструментов>> (оно открывается снизу экрана) меню как бы прыгает, то есть видно явный скачок блока вверх. А в случае закрытия скачок вниз. Этот скачок занимает 0.2 - 0.5 секунд, то есть не сильно критично, но хотелось бы узнать, есть ли решение данной проблемы?
P.S. Пробовал добавить к меню box-shadow, тем самым увеличить высоту блока с запасом в несколько пикселей, но нюанс заключает в том, что в само меню добавлено CSS свойство background-image, а на сколько я знаю, в box-shadow нельзя добавить изображение. Так же в меню были использованы свойства height, с подсчётом высоты viewporta.
Прикрепляю картинки с проблемой:
Момент открытия 1 меню: https://ibb.co/bWDT7hD
Момент скрытия 1 меню: https://ibb.co/8rKqdCW
Скрытое 1 меню: https://ibb.co/30Dn6bG
Скрытое 2 меню: https://ibb.co/f9wk0NR
Момент открытия 2 меню: https://ibb.co/KVHyKyH
Открытое 2 меню: https://ibb.co/kmg6rJV
Момент скрытия 2 меню: https://ibb.co/Nn538hK
Заранее всем спасибо за помощь!