Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • November 8, 2022 at 4:43 pm #1371769
    navindesigns

    On my homepage towards the bottom – https://balrajt13.sg-host.com/ – I have. section called “Industries We Serve” which has 4 columns on desktop which is great but on mobile I would like it to be 2×2 columns instead of being stacked (to avoid long page scroll)

    How do I achieve that?

    Thanks

    November 8, 2022 at 5:30 pm #1371780
    Nikko

    Hi navindesigns,

    Please make sure to make those rows in equal height, then try adding this CSS code:

    .responsive #top.home #wrap_all #av_section_5 .av-equal-height-column-flextable {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 20px;
}

.responsive #top.home #wrap_all #av_section_5 .av-equal-height-column-flextable .av-flex-placeholder {
    display: none;
}

    Hope it helps.

    Best regards,
    Nikko

    November 8, 2022 at 6:29 pm #1371788
    navindesigns

    Works Perfect.

    Thanks as always

    November 8, 2022 at 8:10 pm #1371811
    Mike

    Hi,
    Glad Nikko was able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘2 columns on mobile’ is closed to new replies.