0

I have this simple Javascript code to change custom CSS attribute 

var root = document.documentElement;
root.style.setProperty("--custom-bg", "#4f5357");

This works fine in Firefox Google Chrome but it doesn't work in IE 11 also tried 

root['--custom-bg'] = "#4f5357";
root.attr("--custom-bg", "#4f5357");
root.style['--custom-bg'] = "#4f5357";

none of them worked .

Firas BC
  • 13
  • 7

2 Answers2

2

IE11 doesn't support css custom properties, therefore it doesn't supports this setProperty method.

Checkout this css-vars-ponyfill, which aims to add basic support.

felixmosh
  • 32,615
  • 9
  • 69
  • 88
0

Answered: Workaround for CSS variables in IE?

This was the best solution for me, no installation is needed:

https://www.npmjs.com/package/ie11-custom-properties

Copy this to the head of your html:

<script>window.MSInputMethodContext && document.documentMode && document.write('<script src="https://cdn.jsdelivr.net/gh/nuxodin/ie11CustomProperties@4.1.0/ie11CustomProperties.min.js"><\x2fscript>');</script>
hamate
  • 21
  • 4