Why !important is not working in react js with inline style

Question

I am using inline style in react js like

style={{ textAlign: "center !important;" }}

Answer 1

As it is not possible in reactJs, please read this article https://github.com/facebook/react/issues/1881#issuecomment-262257503

But there is a way you can still use it :

<div ref={element => { 
         if (element) element.style.setProperty('textAlign', 'center', 'important'); 
       }}
/>

Answer 2

You can use it like this:

<div ref={(node) => {
    if (node) {
        node.style.setProperty("float", "right", "important");
    }
}}>
                
</div>

Answer 3

try simple without "!important;"

style={{ textAlign: "center" }}