Skip to content

Commit

Permalink
Add note about polyfilling CSS Grid for IE11. (#12035)
Browse files Browse the repository at this point in the history
  • Loading branch information
leerob authored Apr 20, 2020
1 parent b52d7ff commit 16ee0fe
Showing 1 changed file with 2 additions and 1 deletion.
3 changes: 2 additions & 1 deletion docs/advanced-features/customizing-postcss-config.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,14 +24,15 @@ Out of the box, with no configuration, Next.js compiles CSS with the following t
- [Break Properties](https://developer.mozilla.org/en-US/docs/Web/CSS/break-after)
- [`font-variant` Property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant)
- [Gap Properties](https://developer.mozilla.org/en-US/docs/Web/CSS/gap)
- [Grid Layout](https://developer.mozilla.org/en-US/docs/Web/CSS/grid)
- [Media Query Ranges](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries#Syntax_improvements_in_Level_4)

By default, [Custom Properties](https://developer.mozilla.org/en-US/docs/Web/CSS/var) (CSS variables) are **not compiled** for IE11 support.

CSS variables are not compiled because it is [not possible to safely do so](https://github.com/MadLittleMods/postcss-css-variables#caveats).
If you must use variables, consider using something like [Sass variables](https://sass-lang.com/documentation/variables) which are compiled away by [Sass](https://sass-lang.com/).

> **Note**: To support [Grid Layout](https://developer.mozilla.org/en-US/docs/Web/CSS/grid), you need to enable `grid: "autoplace"` for Autoprefixer. See "Customizing Plugins" below.
## Customizing Target Browsers

Next.js allows you to configure the target browsers (for [Autoprefixer](https://github.com/postcss/autoprefixer) and compiled css features) through [Browserslist](https://github.com/browserslist/browserslist).
Expand Down

0 comments on commit 16ee0fe

Please sign in to comment.