Я использую Bootstrap 4 и создал сетку. Одна из моих областей сетки - это боковая панель / меню, которая представляет собой столбец фотографий. Я бы хотел, чтобы эта колонка простиралась до самого нижнего колонтитула. Первоначально он работал, а затем я добавил еще несколько разделов, и теперь он останавливается на полпути вверх по странице.
Я пытался добавить больше фотографий на боковую панель, но это не помогает. Я также попытался уменьшить размер вновь добавленных разделов, чтобы они не имели ширины 100%, потому что я думал, что это может препятствовать продолжению боковой панели вниз.
Некоторые визуальные аспекты портятся, когда я добавляю код в Codepen, но его все равно будет легко понять. Я добавил голубую правую границу в меню, чтобы видеть, где она останавливается. Вот ссылка на Codepen: https://codepen.io/amandathedev/pen/zyEyze
Вот соответствующая часть, я полагаю:
grid-template-areas:
"menu header"
"menu main"
"menu flex"
"menu footer";
#menu {
grid-area: menu;
border-right: 1px solid lightblue;
}
.menu-photo {
max-width: 100%;
}
Я не хочу вставлять сюда весь раздел, так как в основном это список ссылок на фотографии. Спасибо!