I’m trying to make the 250px number inside the minmax function dynamic inside a styled component.
Normally I could just use something like this:
minmax(${props => props.minWidth}, 1fr)
But this breaks instantly and won’t even render because it’s invalid syntax.
This is my code right now without it being dynamic. Any ideas much appreciated 🙂
const GridContainer = styled.div`
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
grid-auto-rows: auto;
grid-gap: 20px;
width: 100%;
`;