Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #1199207

    I’m hoping someone can help. The behaviour of a column on the mobile view is to stack each one top of another, 1 column per row. My client doesn’t like how it looks and would like it to be 2 columns per row.

    Try 1)

    In the 1st section of icon on the home page I’ve tried using the method layed out in the documentation ( to try to collapse 4 columns into two.

    Try 2)

    In the 2nd section of icons I tried using the solution I found in another thread.

    Neither of these worked for me. Can someone please take a look and let me know what I may be doing wrong.


    Does anybody have any ideas?


    Hi hotspot01,

    Credentials did not work for me. Could you please update the credentials?

    Best regards,


    I just confirmed them. It should be good to go.


    Hi hotspot01,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    @media only screen and (max-width: 767px) {
        .responsive #top #wrap_all .flex_column.avia-link-column.av_one_fourth,
        .responsive #top #wrap_all .flex_column.avia-link-column.av_one_fifth {
            width: 50%;
            clear: none;
            float: left;
            min-height: 240px;

    If you need to limit the code to this page only you’ll need to use the page id class. If only to this section, you’ll need to give the custom id or class to the section.

    If you need further assistance please let us know.

    Best regards,

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

You must be logged in to reply to this topic.