높이를 모르는데 BG를 다 채우고 싶을때

.parent {
  display: flex;
  flex-direction: column;
  height: 100%; /* 부모 컴포넌트의 높이를 100%로 설정 */
}

.header {
  /* 헤더 스타일 */
}

.footer {
  /* 푸터 스타일 */
}

.content {
  flex: 1; /* 헤더와 푸터를 제외한 모든 공간을 사용 */
  overflow-y: auto; /* 내용이 넘치는 경우 수직 스크롤바 생성 */
}

가 기본 원칙

 

Body에 flex flex-col h-full 넣으면 3단분리

page.ts에 다시 flex flex-col h0full 넣으면 거기서 또 안에서 분리

원하는 content에 flex-1 추가하면 분리되고 분리된 나머지를 채울 수 있다 ㅅㅂ 존나 이거하는데 2시간 걸린거 실화냐