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

Home Forums CSS White space issue between the DIV rows

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

    Hi There

    Im using normal div container for listing the items in row order, Each row will have two items if the second item on a row is more height than its left item then i’m seeing the white between the first and second row

    I had tried with flex, grid properties which is not exactly solving the issue and it prone to some other responsive issue for inside contents. So any one please give a solution to resolve this

    Working example:-
    (You will see the white space between first and second row – where i need to be place the next div, likely auto adjust divs based on the available space)


    This is entirely normal (you’re after what is called the “masonry” look) and although CSS-Grid can do this I’d suggest you review this definitve Q&A first.

    It’s not as simple as it looks even with CSS-Grid.


    Paulie_D, thanks for reply.

    I went through stackflow you referred. This is what i want exactly but here all the divs are with the same width so it works perfectly. But my case is little different as it will have custom width and more over they are drag and drop divs where it can be rearranged div position. So i couldn’t give the static ‘grid-template-columns’ value
    please refer this link for example with drag n drop :-

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