Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • February 7, 2022 at 9:53 am #1339285
    DianaLoola73

    Dear support team
    for the website https://wege-in-die-achtständigkeit.de/ I use a grid row with 2 columns for the start page, one of which is designed with a background image. Everything looks great on the desktop PC, but the background images of the columns are only partially displayed on the mobile phone, mostly they appear completely cropped, as can be seen in the screenshot here: https://wege-in-die-achtständigkeit.de/support/mobile .jpg.
    How can that be and how can I ensure that the pictures are also displayed on the mobile phone?
    Thank you for your edit.
    Best regards Diana

    February 8, 2022 at 5:42 am #1339506
    Ismael

    Hey Diana,

    Thank you for the inquiry.

    The second cell has no intrinsic height because it has no content. This works fine on desktop view because the cell inherits the height of the first cell but it is not the case on mobile view. To fix that, you have to specify the height of the second cell manually using css.

    @media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */
  .flex_cell.av_one_half.av-50th5r-6f4695f56b3386194828c3865ebb54be {
    min-height: 50vh;
  }
}

    You may need to apply a unique class name or ID to the cell and replace the auto generated element ID above.

    Best regards,
    Ismael

    February 8, 2022 at 9:13 am #1339542
    DianaLoola73

    Hello Ismael,
    Many Thanks. The script works perfectly
    Best regards, Diana

    February 8, 2022 at 11:46 am #1339567
    Rikard

    Hi,

    Great, I’m glad that Ismael could help you out. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

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