How can I use the full height of the story canvas?

[MYKingma]

I am using Histoire for isolated component development for a while now, and it works really good! The only problem that I have in my use case is that I can not get it to work with components that fill up the parent container (full width and height/100% width and height). This can for example be the case when I have a component as flex item which I place in a parent flex container.

The problem is that the component does not use all the available height (works fine with the width). I investigated the HTML-elements and styling of the Histoire UI, and found that there is an app div which does not inherit the height of the parent elements (The element I refer to is the selected one in the screenshot). I tried to implement a workaround by adding some css to the .histoire-generic-render-story, but that did not feel like the right approach.

Am I missing something in the documentation, or am I doing something totally wrong? I really like the fact that you can resize the story canvas by dragging the borders. I can see that when the component scales properly, this is a nice way to check out how a component looks for different screen sizes.

Happy to clarify my problem in more detail if needed, hopefully somebody can help🤞🏻