menu

CodePen

Hey Everybody! Come share Pens, ask front-end coding questions, and get/give feedback with your CodePen pals

Channels
Team

child div with 100% height exceeds parent div?

December 1, 2018 at 11:58pm

child div with 100% height exceeds parent div?

December 1, 2018 at 11:58pm (Edited 1 year ago)
I feel that this is a very simple concept that I just can't get to work right. I basically want to fit two child divs together. One with a fixed height set with pixels, and another set with percentage. I want the second div to fill up the rest of the space beneath the first one, basically.
As you can see, part of the background image of the "second" div is cut off.

December 2, 2018 at 12:59am
You're using overflow:hidden that's why it's cut off but it's still 100% height. If you want the second div to fill up the rest of the space, you could use flexbox or simply calc() function like this in https://codepen.io/yuanchuan/pen/6c2b00c014768b277c40e4998326d66c/
like-fill
2
  • reply
  • like
You're using overflow:hidden that's why it's cut off but it's still 100% height. If you want the second div to fill up the rest of the space, you could use flexbox or simply calc() function like this in https://codepen.io/yuanchuan/pen/6c2b00c014768b277c40e4998326d66c/
Thankyou so much
  • reply
  • like