You need to align two block elements alongside each other with CSS. What's your default these days? display: grid; grid-template-columns: repeat(2, 1fr); vs. display: flex; - ThreadSky

About ThreadSky

sebdd.net • 90 days ago

You need to align two block elements alongside each other with CSS. What's your default these days?

display: grid;
grid-template-columns: repeat(2, 1fr);

vs.

display: flex;

Comments

thoresuenert.bsky.social•90 days ago

My rule of thumb is for bigger picture layout go with grid, for smaller components go with flex. For example a modal with header content footer go with grid, button with icon text go with flex.

rathes.me•90 days ago

Just a few months ago, I would have said flex without even thinking about it. But things have slowly changed

https://bsky.app/profile/rathes.me/post/3laojkvepak2e

sebdd.net•90 days ago

Yeah, currently leaning towards grid because I like how you can colocate more logic (flex often requires additional classes on the children to control their size, with grid you can define almost everything on the parent)

rathes.me•90 days ago

Yeah, you can lay-out most of the structure with just styles on the parent!

joecianflone.bsky.social•90 days ago

Flex is for 1 dimension grid is for 2. For the life of me I don’t remember who told me that but I teach it to my students and it eliminates a lot of confusion. So in your case it’s 2 elements so flex.

bram.us•90 days ago

Flex.

sebdd.net•90 days ago

For a specific technical reason or habit/personal preference?

bram.us•90 days ago

For this use case specifically: it’s easy, does what it says on the tin, and auto scales up down when adding/removing children to the container.

Posting Rules

Be respectful to others
No spam or self-promotion
Stay on topic
Follow Bluesky's terms of service

Comments

Posting Rules

Reply