Grid-template-columns: repeat() ? Help!

Grid-template-columns: repeat() ? Help!
0

#1

Right this may be a strange one.

Building a web site with ‘grid’ and when i used the repeat() method it does not work. For example;


.boxes{
   display:  grid;
   grid-template-columns:  repeat(auto-fit, minmax (200px, 1fr));

my items will not move and the columns i need will not form.

yet, when i enter the code ;


.boxes{
   display:  grid;
   grid-template-columns:  1fr 1fr 1fr 1fr;

IT WORKS!!

I am using Firefox developer browser and VS code editor…and my class above is the container not the items. Believe me i have checked several times in case i am going insane!!!

Any ideas???


#2

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make easier to read.

Note: Backticks are not single quotes.

See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.