imko

Есть вариант не заморачиваться)
Но если хочешь сама то тебе нужно просто смотреть высоту колонок. У какой меньше в ту и добавляй

Вот почему :D

Из-за кучи ошибок точно ничего не работает. Ошибка в функции прерывает ее выполнение

https://developer.mozilla.org/ru/docs/Web/API/Wind... - параметр behavior

Все работает, селектор выберет картинку и правила будут приенены, правда еще и первую ссылку в nav выберет но это уже другой вопрос) Может ты хотел написать другие правила?

Ты положишь браузер если у всех элементов спросишь стили и попытаешься найти там overflow
Плюс прокрутка может быть реализована НЕ через overflow а каким-нибудь плагином который просто transform у элемента меняет
Первая проблема более менее обходится сравниванием высоты элемента со scrollHeight, на второй это не сработает.
В общем адекватного способа достоверно найти элементы с прокруткой не вижу(

Ограничь ей максимальную высоту в vh, чтобы всегда было место на экране не занятое картой

Зум просто меняет вьюпорт, если у тебя адаптивная верстка для всех экранов будет то все и останется по красоте

Вынеси в window

window.get_input_data = function ()
{
    let text = document.getElementById("data");
    alert(text.value);
}

Дубли

Никак, если я правильно угадал что ты имеешь в виду.
А вообще POST отправить

Если коротко - выпиливай флоат)
А если не коротко то картинки из-за флоата игнорируют обычную раскладку элементов, в которой ты лишкам мог дать инлайн блок и запретить перенос.
Добавление флекса самому списку на выходе дает требуемый вид но получается говнокод который пока не запустишь не увидишь как он все таки будет работать