---
# System prepended metadata

title: Flexbox and Grid

---

# Flexbox and Grid


## Flexbox Properties

A complete version of these tips with image explanations and links is available at CSS Tricks:
[guide to flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)

**Flexbox layout**
![properties](https://drafts.csswg.org/css-grid/images/flex-layout.png)
    
![properties](https://www.freecodecamp.org/news/content/images/2022/07/Group-42.png)

    
    
## Grid Properties

A complete version of these tips with image explanations and links is available at CSS Tricks:
[guide to grid](https://css-tricks.com/snippets/css/complete-guide-grid/)

**Grid layout**
![properties](https://drafts.csswg.org/css-grid/images/grid-layout.png)

![properties](https://www.freecodecamp.org/news/content/images/2022/07/Group-45.png)
    
    

    
