Variable columns

- [Instructor] Next we'll look at auto-fill and auto-fit.…These properties are really useful for making…a responsive layout because they let you have…a variable amount of columns.…Here we have a container div with a bunch of items…inside it.…Let's say we're making something like a photo gallery…where every item will be the same width.…We know we need to have multiple columns…but we don't know how many because it will be different…depending on the width of the view port.…So looking at the code, I'm going to add…some CSS here on the container element line 12.…

Gonna do grid, template columns to set the number…of columns.…Then I'm gonna do repeat with parenthesis.…Instead of starting with a number for the amount of times…I want it to repeat, I'm gonna start with auto dash fill…and then comma, and then 150 pixels for the width…of each column.…Going over here I refresh and I can see I have 150 pixel…width columns.…But the thing that's different here is it makes…a different number of columns depending how much space…