'iOS 11 | CSS: Background render issue

I have a "menu container" which in this case is: <div class="c-navbar__bottom"></div>

This "menu container" has the following properties:

background: #096538;
position: absolute;
width: 100%;

This "menu container" has a height of 0px whenever the content of the "menu container" is being hidden. Its using the Bootstrap mobile menu trigger(with classes such as "collapse navbar-collapse").

Now to the problem: One of our developers used position: absolute; on the "menu container". In iOS 11 in combination with Safari the background: #096538; is not being rendered upon expanding the content of "menu container". It works once I use position: relative;

I would like to know why it is not being rendered upon using: position: absolute;



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source