CSS Layout – Grid vs. Flexbox

Re:CSS Layout – Grid vs. Flexbox by bradstewart on Tuesday October 13, 2020 @11:21AM (#24766443)

Laying out a set of tabs would be 1D (either horizontal or vertical). Laying out an page with headers, footers, and sidebars would be 2D (vertical and horizontal).

[ Parent | on HN ]

Re:CSS Layout – Grid vs. Flexbox by schwartzworld on Tuesday October 13, 2020 @05:33PM (#24770572)

but headers, footers and sidebars are all trivial with flexbox. what's the advantage of grid in those cases?

[ Parent | on HN ]

Re:CSS Layout – Grid vs. Flexbox by ehutch79 on Tuesday October 13, 2020 @06:43PM (#24771160)

Nope. You're probably abusing flexbox. This layout:

is more what we're talking about. You could do that, but it's not what flexbox was meant for. Try grid out. It will work easier for grid like layouts.

[ Parent | on HN ]

Re:CSS Layout – Grid vs. Flexbox by schwartzworld on Tuesday October 13, 2020 @08:21PM (#24771877)

I know what layout you're talking about and it's trivial with flexbox. Why would you need a grid for that?

[ Parent | on HN ]

Re:CSS Layout – Grid vs. Flexbox by bradstewart on Thursday October 15, 2020 @03:58PM (#24793085)

You don't _need_ grid, but it does make it simpler. You technically don't need flexbox either.

In grid you can define this layout in a single construct. Whereas with flexbox, you're defining several nested flex elements to get there.

You can think about the entire layout as a unit, rather than the horizontal parts first (sidebar/main content) then the vertical (header/footer) or vise versa.

[ Parent | on HN ]