Make child occupy full height

full-height.md

I usally assign root div a color and give it a color with min-height: 100vh (min-h-screen). But sometimes I need to use different style in a page. So if I make this child <div class="h-full">, it doesn't work. See this post.

I found this to be most reliable:

.parent {
  /* min-h-screen */
  min-height: 100vh;
}

.child {
  /* min-h-[inherit] */
  min-height: inherit;
}