You can change your #insideDiv‘s max-height CSS property from 100% to inherit. So this rule will be like this:
max-height: inherit;
You also might want to add box-sizing:border-box; if you go this route, as that will allow any borders or padding on #insideDiv to behave as (probably) desired.
The cause of this issue is that max-height:100%; looks for the parent’s height, not its max-height for how tall it’s allowed to be. Thus, you end up with the classic non-deterministic relative height problem. If you give the parent a deterministic height (rather than max-height), 100% can resolve deterministically.