I'm trying to see how my app will look when css grid isn't available. Is it possible to turn off properties like css grid inside of the chrome or canary?
Asked
Active
Viewed 5,288 times
2
-
1You can absolutely disable CSS rules from the F12 Inspector. – Obsidian Age May 23 '18 at 23:49
-
Possible duplicate of [How to disable CSS in Browser for testing purposes](https://stackoverflow.com/questions/14046738/how-to-disable-css-in-browser-for-testing-purposes) – Obsidian Age May 23 '18 at 23:51
-
3@ObsidianAge it's not about rule, but about a feature ... if it was a rule then we can simply comment the CSS file. He want to see what the code will look if there is not support of css-grid – Temani Afif May 23 '18 at 23:51
-
https://developer.mozilla.org/en-US/docs/Web/CSS/@supports – VXp May 24 '18 at 05:54
-
1Just uncheck the rule. – johnny May 25 '18 at 15:58
3 Answers
2
The CSS Feature Toggles plugin for Chrome can do this. It adds a tab in the developer toolbox with checkboxes for various CSS features that are popular for browsers to not implement, like Grid:
Checking the relevant box will disable the respective feature.
George Hilliard
- 15,402
- 9
- 58
- 96
0
Download an older version of Chrome that doesn't support this feature after checking it on https://caniuse.com/#search=shape-outside.
zavr
- 2,049
- 2
- 18
- 28
-3
Just comment out CSS Grid.
/* .container { display: grid; } */
Or uncheck the rule in dev tools.
Chrome will then ignore all grid properties, just like a browser would that lacks support for the feature.
Michael Benjamin
- 346,931
- 104
- 581
- 701