CSS Grid minmax Function FCC beta help needed

HTML-CSS
1

Hi guys, I’m going though the beta version and seem to be stuck on the “CSS Grid: Limit Item Size Using the minmax Function” challenge. https://beta.freecodecamp.org/en/challenges/css-grid/limit-item-size-using-the-minmax-function

I have tried every combination of syntax I can think of (and google) and nothing works to pass the test.

The instruction: Using the minmax function, replace the 1fr in the repeat function with a column size that has the minimum width of 90px and the maximum width of 1fr, and resize the preview panel to see the effect.

My current best guess was: grid-template-columns: repeat(3, 90px, 1fr);

Any help with figuring this out.
Thanks
-paul

2

What you need to do is replace the just the 1fr for a minmax(). The repeat would then take the 3 as the first parameter, the number of columns, and the second parameter would be the size of the column, which would be your minmax().

1 Like
3

If you can’t solve it, here is the solution:

grid-template-columns: repeat(3, minmax(90px, 1fr));

3 Likes
4 
grid-template-columns: repeat(3,minmax(90px, 1fr));
7 Likes
6

Thank you. I hadn’t considered putting the minmax inside the repeat for whatever reason. I was trying to make a new grid-template-columns: minmax but it wasn’t working, probably for reasons that’ll be obvious as I keep learning.

1 Like
7

Screenshot%20(1)
Screenshot%20(1)1920×1080 217 KB

8

Had the same challenge but thanks to the Forum