iPhone/Mobile view on iPad in portrait view

Hi Thomas,

Do you want it only to affect a single page? multiple pages? or all pages?

Best regards,
Nikko

Hi Thomas,

Can you try adding this CSS code in Quick CSS, located in Enfold > General Styling:

@media only screen and (max-width:959px) {
    .responsive #top .flex_column_table_cell {
        display: block;
    }

    .responsive #top .container .av-content-small, .responsive #top #wrap_all .flex_column, .responsive #top #wrap_all .av-flex-cells .no_margin {
        margin: 0;
        margin-bottom: 20px;
        width: 100%;
    }
}

Hope it helps.

Best regards,
Nikko

Hi civilizedk,

Can you try to use this CSS code instead:

@media only screen and (max-width:959px) {
    .responsive #top .flex_column_table_cell {
        display: block;
    }

    .responsive #top .container .av-content-small, .responsive #top #wrap_all .flex_column, .responsive #top #wrap_all .av-flex-cells .no_margin {
        margin: 0;
        margin-bottom: 20px;
        width: 100%;
    }

    .responsive .avia-testimonial-wrapper, .responsive .avia-testimonial-row, .responsive .avia-testimonial {
        display: block;
        width: 100%;
        float: none;
    }

    .responsive #top .avia-testimonial {
        border-bottom: 1px dashed #e1e1e1;
        border-right: none;
        padding: 20px 0;
    }

    .responsive #top .avia-testimonial-row:last-child .avia-testimonial:last-child {
        border: none;
    }

    .responsive #top .av-hide-on-mobile {
        display: none !important;
    }

    .responsive.av-no-preview #top #wrap_all .av-medium-hide {
        display: block !important;
    }
}

The layout should be the same but the width is different.

Best regards,
Nikko