the 100% height not working when the parent height is set using vh in android

Question

I faces this problem With Chrome on Android, it worked on other browser on the same device:

The problem is the nested DIV does not fill its parent(which its height is 100vh) when I set the height with 100%.

<style>
    #a{width:100%;height: 100vh;background-color: red;}
    #a .inner {width: 100%;height: 100%;min-height: 100%; background-color: green;}
</style>

<div id="a">
    <div class="inner">The GREEN must fill the screen</div>
</div>

I tested on Chrome version: 26.0.1410.58 and 30.0.0.0.

:(

Answer 1

It seems it is a bug on Chrome. I tested on Chrome version 44.0.2403.133 and it worked correctly.

But we need to find a solution to work arround this