codemarch Profile picture
Tech, reimagined with AI 🤖 Daily AI tools, workflows & use-cases 🎯 Turn AI into income 💰

Jan 26, 2023, 11 tweets

A quick glance at "CSS Grid Container "

Thread🧵

🔶 CSS Grid Container

To make an HTML element behave as a grid container, you have to set the `display`property to `grid` or  `inline-grid`

🔹 The grid-template-columns Property

The `grid-template-columns` property defines the number of columns in your grid layout, and it can define the width of each column.

Example👇

🔹The grid-template-rows Property

The `grid-template-rows` property defines the height of each row.

Example👇

🔹 The justify-content Property

The `justify-content` property is used to align the whole grid inside the container.

Example👇

🔹The align-content Property

The `align-content` property is used to *vertically* align the whole grid inside the container.

Example👇

if you enjoyed this thread, please like, comment, and retweet the opening tweet.
🔹Follow @codemarch
🔹You can also check our HTML & CSS Visual Treat!😍for more!!!
codemarch.gumroad.com/l/hxazr

Share this Scrolly Tale with your friends.

A Scrolly Tale is a new way to read Twitter threads with a more visually immersive experience.
Discover more beautiful Scrolly Tales like this.

Keep scrolling