0

I want to use inline styles with a computed variable in my React Code - for background css property and the value is 

const bkgStyle = {
  background: `linear-gradient(97.84deg, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%), ${primaryColor}`,
  height: '165px',
};

How can I add vendor prefix for this - nothing works. If i add multiple keys 'background' in bkgStyle then also it doesnt work. and the value for background - is also not accepting a string containing values for all vendors.

Help!!!

Probosckie
  • 1,585
  • 4
  • 25
  • 40
  • Does this answer your question? [How do I apply vendor prefixes to inline styles in reactjs?](https://stackoverflow.com/questions/32100495/how-do-i-apply-vendor-prefixes-to-inline-styles-in-reactjs) – Zydnar Feb 19 '20 at 11:55

1 Answers1

0

You can add vendor prefixes by adding them to the value of the main key. EG:

const bkgStyle = {
    display: '-webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex'
}
Jonathan Irwin
  • 5,009
  • 2
  • 29
  • 48