Last Updated: February 25, 2016
·
1.118K
· lolafeewfawfw

Fix WebKit vw bug

The vw bug is very annoying!

If you haven't experienced it, it is when you resize your browser and WebKit does not update the vw or vh sizes to fit the new size of the viewport. This is a simple, CSS only (no need for JS!) fix that will target WebKit and WebKit only.

@-webkit-keyframes repaintVW {
    from { 
            width: 100vw; 
         }
    to {
        width: 100.001vw;
    }
}

For the element that you are targeting, simply apply the animation...

-webkit-animation: 0.0001s repaintVW infinite;