Dynamic justification based on intrinsic column count
Hello folks! I'm layout something out with CSS Grid: four items. I'm going for a two-column layout on wider viewports, and one-column on narrow viewports. So far so good, including making the switchover intrinsic rather than resorting to media (or container) queries.
The sticking point is that I'm looking to justify the items separately in the two cases. For the one-column layout, I want the items centered or stretched (not fussed either way), but for the two column layout I'd want the left column right-aligned and the right column left-aligned.
ASCII art demonstration:
Is there any way to do this sensibly intrinsically, or do I need to resort to media queries?
The sticking point is that I'm looking to justify the items separately in the two cases. For the one-column layout, I want the items centered or stretched (not fussed either way), but for the two column layout I'd want the left column right-aligned and the right column left-aligned.
ASCII art demonstration:
Is there any way to do this sensibly intrinsically, or do I need to resort to media queries?
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Similar Threads
Was this page helpful?
