Forums

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

Home › Forums › CSS › CSS grid box not spanning two rows

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • August 13, 2018 at 10:04 am #275284
    amidigital
    Participant

    https://codepen.io/AmIDigital/pen/EpgaLZ?editors=1100

    See the two kids to the right on the 2nd row? I would like that area to span down another row.

    Seems like this should do it. grid-row: 2 / 4;

    Thanks!

    August 13, 2018 at 11:13 am #275286
    Paulie_D
    Member

    A minimal demo would be ideal….there’s a lot of code we don’t need in there for you to demo the issue.

    August 13, 2018 at 12:26 pm #275289
    amidigital
    Participant

    I removed about half the code for you.

    August 13, 2018 at 11:11 pm #275295
    Paulie_D
    Member

    The issue is that you set a height on the divs and not on the grid-rows. If the rows don’t know how big they are supposed to be then setting an element to span 2 of them means nothing.

    So, instead of height:200px on the divs, set the row height to 200px;

    https://codepen.io/Paulie-D/pen/OwGWNK

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