nuxodin / ie11CustomProperties

CSS variables (Custom Properties) polyfill for IE11

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

:root variables in media queries don't update on resize

needsmorecoffee opened this issue · comments

I have the following css:

:root {
    --content-width: 300px
}

.content {
    width: var(--content-width);
}

When using a media-query, the --content-width value doesn't seem to update when the client window size changes - it always seems to pick the last value defined. For example, in the following cases, the content-width always seems to be stuck at 150px regardless of screensize.

:root {
    --content-width: 100px

    @media (min-width: 200px) {
        --content-width: 150px;
    } 
}

or

:root {
    --content-width: 100px
}

@media (min-width: 200px) {
    :root {
        --content-width: 150px;
    }
} 

Thank you for your feedback.
The new version 4.0.1 should now work fine.

Tried 4.0.1 and it appears to work fine, thanks for the quick fix :)