Premium WordPress Themes, Templates & Plugins › Support › WordPress Plugin Support › Hexagon Grid Columns

Tagged: , , ,

Viewing 2 reply threads
  • Author
    Posts
    • July 16, 2021 at 6:15 pm #11712
      bendhealth
      Participant

      I need to change the number of columns in the grid. I used this css:

      .mashexagonPro { width: 33% !important; }

      But now the grid does not fall into a beehive. Here is the url:

      Services

      Thanks!

    • July 23, 2021 at 10:01 am #11713
      ThemeofWP
      Keymaster

      Can you please decrease the row? You can use wrapper row and column smaller and this can be a trick for you.

      Thanks
      Kevin JOY

    • July 23, 2021 at 10:14 am #11714
      ThemeofWP
      Keymaster

      There is a rule for it actually in https://bendhealth.genesis-unlimited.com/wp-content/plugins/wpbakery-hexagon-masonry-gallery/assets/vc_hexagon_gallery_pro.css?ver=5.8:

      @media (max-width: 900px) and (min-width:601px) { /* <- 3-2  mashexagonProagons per row */
  #mashexagonProGrid{
    padding-bottom: 7.4%;
    font-size: 14px;
  }
  .mashexagonPro {
    width: 33.333%; /* = 100 / 3 */
  }
  .mashexagonPro:nth-child(5n+4){ /* first mashexagonProagon of even rows */
    margin-left:16.666%;  /* = width of .mashexagonPro / 2  to indent even rows */
  }
}

      You need to change screen size for it like this:

      @media (min-width:1201px) { /* = 100 / 3 */
  #mashexagonProGrid{
    padding-bottom: 7.4%;
    font-size: 14px;
  }
  .mashexagonPro {
    width: 33.333%; /* = 100 / 3 */
  }
  .mashexagonPro:nth-child(5n+4){ /* first mashexagonProagon of even rows */
    margin-left:16.666%;  /* = width of .mashexagonPro / 2  to indent even rows */
  }
}

      I hope this works for you.

  • Author
    Posts
Viewing 2 reply threads
  • You must be logged in to reply to this topic.