Problem description

A .grid-container measuring 200×200px contains a single child .centroid. The task is to center the child element both horizontally and vertically using CSS Grid.

Goal

Place the 🚩 exactly at the geometric center of the grid container.

Constraints

Implement the solution using only CSS on the existing container; no additional wrappers or scripts are allowed.

Sample visual output

Here’s what the output would look like:

Good luck trying the problem! If you’re unsure how to proceed, check the Solution.