min-height on parent element not respected

[lucastheisen]

Bug report

Live example URL: https://jsfiddle.net/lucastheisen/qmf149jq/1/

Steps to repro:

1. create a containing div
2. create an inner div
3. set min-height on containing div

Expected behavior

The height of the plottable component should be at least as large as the min-height of the parent.

Actual behavior

0 height

Possible Solution

Context

I want my plottable components to take up as much space as is available in the containing element. If the containing element has a height set, this works. But if min-height is set, it doesn't. I prefer to use min-height on containers to allow more flexibility...

Environment

• Plottable version: 3.1.1
• Browser name/version: Firefox 53
• OS name/version: Windows 10 (1607)

[hellochar]

Thanks for the file! I think you're hitting https://stackoverflow.com/questions/8468066/child-inside-parent-with-min-height-100-not-inheriting-height - specifically

The percentage is calculated with respect to the height of the generated box's containing block. If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the value computes to 'auto'.
Therefore, as the min-height parent does not have an explicit height property set, it defaults to auto.

I was able to get your example to work by adding min-height: inherit; to the #plot

[lucastheisen]

@hellochar , using inherit seems reasonable enough...