Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • June 28, 2018 at 9:20 am #978798
    laptophobo

    I have a 4 column grid row that I would like to see reduced to 2 columns (and 2 rows) when the device is viewed at 767px or lower. I do see the option within Grid Row>Screen Options>”Fullwidth Breaking Point”, but this option sets the rows to 1 column (100%) at 767px. In other words, on a small screen I’d like to see the rows 2 columns and 2 rows, as opposed to 1 column and 4 rows.

    Can this be done?

    June 29, 2018 at 1:54 pm #979367
    Ismael

    Hey laptophobo,

    Thank you for using Enfold.

    Yes, it’s possible. Please try this css code to adjust the cells’ width.

    @media only screen and (max-width: 767px) {
.responsive #top #wrap_all .av-flex-cells .no_margin {
    display: block;
    margin: 0;
    height: auto !important;
    overflow: hidden;
    padding-left: 8% !important;
    padding-right: 8% !important;
    width: 50%;
    float: left;
}
}

    Or provide a link to a test page so that we can inspect it.

    Best regards,
    Ismael

    July 1, 2018 at 11:19 am #979792
    laptophobo

    Thanks Ismael.

    July 2, 2018 at 6:43 am #979947
    Ismael

    Hi,

    Awesome! Glad we could help!

    Please take a moment to review our theme and show your support https://themeforest.net/downloads
    Don’t forget to bookmark Enfold Documentation for future reference.

    Thank you for using Enfold :)

    Best regards,
    Ismael

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