Skip to content

Commit

Permalink
feat: lab 6 grid tip
Browse files Browse the repository at this point in the history
  • Loading branch information
albertkun committed Jul 29, 2024
1 parent 061c6fc commit e526ece
Showing 1 changed file with 24 additions and 1 deletion.
25 changes: 24 additions & 1 deletion docs/labs/week6/3.md
Original file line number Diff line number Diff line change
Expand Up @@ -54,4 +54,27 @@ This flexibility is what makes opensource tools and plugins so great! However, b

Congrats!

After you've made this change the time has come to make a pull request!
After you've made this change the time has come to make a pull request!

### CSS Grid Tip

When you have many items in a row, you can use the `grid-template-columns` property to make sure they are spaced out evenly.

```css
.grid-container {
display: grid;
grid-template-columns: auto auto auto;
}
```

You can also use CSS grid to make evenly spaced items for a responsive design.

```css
.grid-container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}
```

This will make sure that the items are at least 200px wide, but will expand to fill the space if there is more room.

0 comments on commit e526ece

Please sign in to comment.