Привет! Пожалуйста, реализуй для левой панели (с изображением леса) эффект фиксированного масштаба.
Цель: При изменении высоты правой колонки (например, при переключении табов), картинка на левой панели не должна растягиваться или сжиматься. Она должна сохранять свои пропорции. При увеличении высоты контента, панель должна просто "открываться" вниз, показывая больше того же изображения леса в том же масштабе. При уменьшении высоты контента, она должна укорачиваться, скрывая нижнюю часть картинки.
Примени для контейнера изображения CSS-свойство background-size: cover и, возможно, зафиксируй масштаб (например, background-size: auto 1000px, где 1000px - высота исходного изображения). Позиционируй изображение сверху (background-position: top center). Проверь, что деревья сохраняют свой естественный, grand-масштаб, как показано на примерах.
При переключении вкладок «Лечебное дело» и «Педиатрия» страница «прыгает» по высоте, потому что во вкладке Педиатрии меньше предметов и общая высота блока уменьшается.
Исправь это в CSS. Для контейнера, в котором находятся кнопки предметов, задай фиксированную минимальную высоту (min-height), равную высоте списка «Лечебное дело».
Например, добавь такое свойство для этого блока:
.items-container { /* Замени этот класс на реальный класс контейнера предметов */
min-height: 400px; /* Подобрать точную высоту в пикселях, чтобы при переключении ничего не двигалось */
}
Также убедись, что нижние элементы управления (кнопки «Начать тест», «Содержание») не привязаны жестко к изменяющейся высоте списка.
