javascriptangulartypescriptionic3pseudo-element

Property 'pseudoStyle' does not exist on type 'HTMLElement'


I'm trying to modify the pseudo element's height using Typescript.

I'm getting the following error in my IDE (vscode)

This is my code.

// select element
let el: HTMLElement = document.getElementById('filter-container');
//  style the height of psydo element
el.pseudoStyle("before", "height", newHeight);
...

Solution

  • You can't style a pseudo-class on a particular element alone, you can do it by altering the stylesheet:

    document.styleSheets[0].insertRule('#id:hover { background-color: blue; }', 0);
    document.styleSheets[0].cssRules[0].style.backgroundColor= 'blue';