Skip to content

Commit 2c2661c

Browse files
committed
Added CSS snipet for grid layout
1 parent 22ce5fe commit 2c2661c

File tree

1 file changed

+17
-0
lines changed

1 file changed

+17
-0
lines changed

public/data/css.json

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,23 @@
2121
{
2222
"categoryName": "Layouts",
2323
"snippets": [
24+
{
25+
"title": "Grid layout",
26+
"description": "Equal sized items in a responsive grid",
27+
"code": [
28+
".grid-container {",
29+
" display: grid",
30+
" grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));",
31+
"/* Explanation:",
32+
"- `auto-fit`: Automatically fits as many columns as possible within the container.",
33+
"- `minmax(250px, 1fr)`: Defines a minimum column size of 250px and a maximum size of 1fr (fraction of available space).",
34+
"*/",
35+
"}",
36+
""
37+
],
38+
"tags": ["css", "layout", "grid"],
39+
"author": "xshubhamg"
40+
},
2441
{
2542
"title": "Sticky Footer",
2643
"description": "Ensures the footer always stays at the bottom of the page.",

0 commit comments

Comments
 (0)