Streaming live at 10am (PST)

Is there a way to center the content of CSS grid?

I would like for the content of my grid to be centered as seen in the screenshot, as opposed to aligning to the left.

38%20AM

Maybe CSS grid isn’t the best way to achieve this?


I would recommend using a flexbox instead of a grid for this. You can centre align flexboxes and they’re more responsive than the grid. Especially if you enable ‘wrap child’.

1 Like

@peej => Providing a read-only link would allow for more feedback.

Actually @peej you can align left, right, and center using grid.

You would just need to use the align options.
CloudApp

1 Like

Yes, this is possible in CSS Grid, as @WebDev_Brandon indicates.

Example;

https://cl.ly/89678d90f435

as far as I can tell this only aligns the content within the grid “blocks”, but the blocks are still in a regular pattern, which does not achieve the effect in the screenshot unfortunately

@peej in the example u provided u can still accomplish it with Grid.

Could you expand?
I’ve copied your settings, and the grid items are not displaying the way you see in the screenshot.

@peej,

Please provide your share link. When you do that I’ll show you how it can be achieved.

How to create a share link reference this video: https://www.loom.com/share/8c7cf88cdb134278bfc3660cebd96260