Autoprefixer: [css-grid] Bug when specifying two values for grid-gap

Created on 16 May 2018 · 5Comments · Source: postcss/autoprefixer

Test case:

.a-two {
    grid-gap: 2rem 1rem;
    grid-template-rows: 1fr minmax(100px, 1fr) 2fr;
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas:
        "head-two head-two head-two"
        "nav-two  main-two main-two"
        "nav-two  foot-two foot-two";
}

Expected:

.a-two {
    grid-gap: 2rem 1rem;
    -ms-grid-rows: 1fr 2rem minmax(100px, 1fr) 2rem 2fr;
    grid-template-rows: 1fr minmax(100px, 1fr) 2fr;
    -ms-grid-columns: 1fr 1rem 1fr 1rem 1fr;
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas:
        "head-two head-two head-two"
        "nav-two  main-two main-two"
        "nav-two  foot-two foot-two";
}

Actual:

.a-two {
    grid-gap: 2rem 1rem;
    -ms-grid-rows: 1fr 2rem 1rem minmax(100px, 1fr) 2rem 1rem 2fr;
    grid-template-rows: 1fr minmax(100px, 1fr) 2fr;
    -ms-grid-columns: 1fr 2rem 1rem 1fr 2rem 1rem 1fr;
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas:
        "head-two head-two head-two"
        "nav-two  main-two main-two"
        "nav-two  foot-two foot-two";
}

bug support

Source