How to create grid layout in archive

Home Forums Mustang How to create grid layout in archive

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #18158

    kuper
    Participant

    How to create grid layout in archive

    Resolved

    How to create grid layout in archive, like at wm-post layout?

    #18159

    Oliver Juhas
    Keymaster

    Hi kuper,

    This is not possible out of the box in the theme. You need to use a custom code to achieve such layout. Here is some custom CSS you can start with:

    .archive .list-articles {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
      margin: -1em;
    }
    
    .archive .list-articles article,
    .archive .list-articles article:first-child {
      margin: 1em;
      width: calc(100% - 2em);
    }
    
    @media only screen and (min-width: 640px) {
      .archive .list-articles article,
      .archive .list-articles article:first-child {
        width: calc(50% - 2em);
      }
    }
    
    @media only screen and (min-width: 1280px) {
      .archive .list-articles article,
      .archive .list-articles article:first-child {
        width: calc(33.33% - 2em);
      }
    }

    Best regards,

    Oliver Juhas
    WebMan Design

    #18163

    kuper
    Participant

    thanks Oliver Juhas your css work :x

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.