Today I learned about the CSS property place-items, it allows you to easily position elements in flex and grid layouts. It also solves the eon old quest to "center something in a div".
To center the single child of a div simply add display: grid; and place-items: center;.
Place-items takes up to two parameters. The first to place the items vertically and the second to place them horizontally.
This concludes out TIL, see you next time.
.wrapper-that-centers {
  display: grid;
  place-items: center;
}
              


    
Top comments (0)