@supports not working on iOS 9.3.2?

[hiswe]

@supports not working on iOS 9.3.2?

[ErikVeland]

If I remove the @supports it still doesn't calculate the offset. It definitely has

<style>​:root { --vh-offset: 69px; }​</style>​

in the DOM.

[ErikVeland]

Strangely it works if I removed the first declaration of min-height. If only I could get this to work with @supports now it would be perfect :/

[Hiswe]

@ErikVeland I think It's because my example use a CSS pre-processor…

The code should be:

main {
  /* for browser supporting VH without buggy behaviour & no supporting of CSS var */
  min-height: calc(100vh);
}
/* make sure that CSS var are supported */
/* buggyFill will work on iOS 9.3+ only */
/* will degrade on a buggy 100vh on older version of iOS */
@supports (height: var(--vh-offset)) {
  main {
    min-height: calc(100vh - var(--vh-offset));
  }
}

I'll fix that ^^

[Hiswe]

@ErikVeland I've updated the README and the examples.

Tell me if your problem is solved.

[ErikVeland]

Thank you. I got it working! Also noticed that the JavaScript example also assumes some sort of library with the require function (node.js?)

[Hiswe]

@ErikVeland The JS code is build as an UMD module.

In the README, it's using browserify (I should make it more clear…)
But you could also use the file directly like in the test-global example