23. What are the differences between CSS Grid and Flexbox and when should you use each?

• CSS Grid: Better for creating two-dimensional layouts. It allows defining rows and columns and precise positioning of elements in both dimensions (front-back).
• Flexbox: Better for one-dimensional layouts, where elements are arranged in a single row or column. It allows flexible arrangement of elements along the main axis.

/* Examples */
.container-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 10px;
}