8.3 “Benigno Numine”

Autoprefixer 8.3 adds @media support for grid-template and fixes gradient direction warning.

Media and Grid Layout

@evgeny-petukhov continues his great work for Grid Layout support in Autoprefixer.

Now he improved @media support. Now this CSS will work in IE:

body {
    grid-template:
        [header-left] "head head" 30px [header-right]
        [main-left]   "nav  main" 1fr  [main-right]
        [footer-left] "nav  foot" 30px [footer-right]
        / 120px repeat(4, 250px 10px);
}

header {
    grid-area: head;
}

main {
    grid-area: main;
}

footer {
    grid-area: footer;
}

@media (min-width: 1000px) {
    body {
        grid-template:
            [header-left] "head" 30px [header-right]
            [main-left]   "main" 1fr  [main-right]
            [footer-left] "footer" 30px [footer-right]
            / 1fr;
    }
}

Don’t forget that Autoprefixer inserts Grid Layout prefixes only if you set grid: true option.

Gradient Warning

@radium-v found that Autoprefixer show warning even if cover is outside of radial-gradient.

a {
    background: radial-gradient(#fff, transparent) 0 0 / cover no-repeat #f0f;
}

@kotfire improve old direction detection and fix this issue.