Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • October 17, 2017 at 7:03 am #865165
    Guenni007

    if we choose the option equal height than the columns goes to a table layout.
    is it possible to have in responsive case first ( f.e. und 990px) a 1/2 layout and than second (f.e. under 768px) the 1/1 layout ?

    Now it goes late directly to the 1/1 layout

    October 17, 2017 at 8:59 am #865186
    Guenni007

    because the site is a live site i changed to individual height – that is easy to reach now. But there might be a solution – maybe that the table layout than under responsive case is gone.

    October 19, 2017 at 5:29 am #866069
    Ismael

    Hi,

    Please use the following css code.

    @media only screen and (max-width: 1024px) {
   .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%;
   }
}

    Best regards,
    Ismael

    October 22, 2017 at 9:52 pm #867343
    Guenni007

    Thanks Ismael – that is normal behavior
    i want it with equal height and first go to 2 column ( 50% ) than to 1 column.
    As the version with individual height does.

    But anyway it is not so important. It looks good on individual height aswell.

    October 24, 2017 at 4:04 am #867949
    Ismael

    Hi,

    i want it with equal height and first go to 2 column ( 50% ) than to 1 column.

    Maybe, you can add another css media query to adjust the width of the columns to 50% before it turns to single columns. Just make sure that the columns’ display property is set to “block”.

    Best regards,
    Ismael

    October 26, 2017 at 5:44 pm #869269
    Guenni007

    yes – but even i’m (lol) not able to get it. The display table is tricky.

    October 28, 2017 at 4:01 pm #869934
    Ismael

    Hi,

    The following css code is working but it may require a few adjustments.

    @media only screen and (max-width: 1024px) and (min-width: 768px) {
    .responsive #top #wrap_all .flex_column, .responsive #top #wrap_all .av-flex-cells .no_margin {
        width: 48%;
    }

    .responsive #top .flex_column_table_cell {
        display: block;
        float: left;
    }
}

    Best regards,
    Ismael

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.