CSS flex-flow

Creator

Creator

Created

Created

2021 May 31 7:36

Editor

Editor

Edited

Edited

2021 Jun 28 7:22

Refs

Refs

notion image


.wrapper {
  display: flex;
  flex-flow: column;
  height: 100%;
}

.header {
  flex: 0 1 auto;
}

.content {
  flex: 1 1 auto;
}

vertical fill

Make a div fill the height of the remaining screen space

I am working on a web application where I want the content to fill the height of the entire screen. The page has a header, which contains a logo, and account information. This could be an arbitrary height. I want the content div to fill the rest of the page to the bottom.

https://stackoverflow.com/questions/90178/make-a-div-fill-the-height-of-the-remaining-screen-space

JavaScript is not available.

https://twitter.com/flowforfrank/status/1405789880379002882/photo/1

JavaScript is not available.

Recommendations

///////////