The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Can flexbox span two rows?

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #205053

    Hello folks;
    I bet this is easy for you, but I’m struggling. There’s a cool pen that I grabbed for image-grid code. Since I have one category that needs a portrait image, I started working on one <div> that spanned the rows.
    Sadly it’s fighting me.
    Here’s the original.

    Here’s what I’m working on.
    The column does span, but the four images wont take up the remaining space. Wouldn’t it be easier just to change the ‘Portrait’ section so that it spanned and the lower two shifted to the left?


    It sounds like you need anelement to be in two rows at the same time…that’s not possible. flexbox lays out elements and all standard HTML elements are rectangular (for now).

    Do you have an image of what this is supposed to look like. I suspect you’re after some kind of masonry effect and flexbox won’t help much there


    Thank you Paulie;
    I was thinking that what would be ideal is to have the same layout as the first codepen, but flipped 90 degrees using ‘flex-direction:column’
    that hasn’t seemed to work.

    I can’t reach my server right now, but here’s one off a friend’s.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.