Autoprefixer does not work in Angular 7

[HristoP96]

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting

Command (mark with an x)

- [ ] new
- [x] build
- [x] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions

Angular CLI: 7.1.3
Node: 10.14.1
OS: win32 x64
Angular:
...

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.11.3
@angular-devkit/core         7.1.3
@angular-devkit/schematics   7.1.3
@schematics/angular          7.1.3
@schematics/update           0.11.3
rxjs                         6.3.3
typescript                   3.1.6

Repro steps

angular7Project.zip

Step1: install node_modules for the above provided project.

Step2: run ng serve

Step3: Open the browser devtools and focus the element with class "sample-div", which has display:grid as applied style.

Desired functionality

The .sample-div should also contain the prefixed style which is display: -ms-grid like in Angular 6.

angular6Project.zip

[alan-agius4]

This is the indented behaviour in Version 7 see: #11453

To enable autoprefixing for grid you need add /* autoprefixer grid: on */.

[anjildhamala]

@alan-agius4 Where should I add /* autoprefixer grid: on */ ? This is unfamiliar territory for me.

[EmmanuelDemey]

You can try to add this comment in your scss / css files. If you put this comment on the top, it will enable grid for all the file. If you set it in a declaration block, grid will only be available inside this block.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}