My father-in-law loves the Olive Garden. So of course that’s what we offered to bring for our first post-vaccination meal.
[…]
Nicolas Hoizey first noticed this problem on Mobile Safari back in 2015. He submitted a bug to Apple and Webkit, but was told the behavior was intentional. In December 2016, Chrome changed its behavior to be consistent with Safari:
[…]
To solve this problem, we’ll use a solution created by Louis Hoebregts that uses CSS custom properties and JavaScript to always find the correct height of the visible portion of the page. Louis wrote:
Let’s say our CSS custom variable is --vh for this example. That means we will want to apply it in our CSS like this:
OK, that sets us up. Now let’s get the inner height of the viewport in JavaScript:
We told JavaScript to grab the height of the viewport and then drilled it down into 1/100th of that total so we have a value to assign as our viewport height unit value. Then we politely asked JS to create the CSS variable (--vh) at the :root.
[…]