Svelte-kit / scss, как сделать нижний колонтитул внизу страницы ⇐ CSS

[Гость]

Я новичок в svelte-kit

В качестве учебного проекта я хочу проверить, как оформить страницу

Я использую __layout. svelte со свойством flex в CSS(scss), чтобы заполнить страницу основным контентом и сделать верхний колонтитул сверху, а нижний колонтитул внизу. Я использовал следующий код:

Заголовок Нижний колонтитул :Глобальный { тело { маржа: 0; высота: 100%; #стройный { дисплей: гибкий; гибкое направление: столбец; высота: 100%; } } } заголовок { фон: #333; цвет: RGB(100, 230, 170); отступ: 10 пикселей; размер шрифта: 1.2rem; } основной { цвет фона: бланшированный миндаль; гибкий: 1; отступ: 15 пикселей; переполнение-у: авто; } нижний колонтитул { фон: #ддд; цвет: #333; дисплей: гибкий; отступ: 10 пикселей; размер шрифта: 1.2rem; начертание шрифта: жирный; оправдание-содержание: центр; } но у меня основная часть растянута, а нижний колонтитул не внизу.

как на картинке ниже: