minmax CSS function is not recognized in React project

user_16953936 0
Viewed 239

I used the following line to style a material UI grid in my react project.

gridTemplateColumns: Repeat("auto-fit", minmax("300px", "1fr"))

I get this error "ReferenceError: minmax is not defined".

It looks React knows the repeat CSS function but not the minmax function. I could not figure out why. Any help would be appreciated.

minmax referenceerror reactjs css
1 Answers

You're currently trying to call functions and pass strings into them, but that's incorrect. gridTemplateColumns needs to be a string, not a function call. The string happens to look like function calls, but if any code needs to be run, the browser will do that, not you.

style={{
  gridTemplateColumns: "repeat(auto-fit, minmax(300px, 1fr))"
}}
user_37948120
Related