Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • March 22, 2022 at 8:21 pm #1345582
    madakumbu

    Hello

    I’ve a page with 4 sections using a grid element.
    Each one has 2 cells, one with a background image and the other with block text and colour background.

    It looks fine on the computer screen, but not on mobiles (tested on 6,55px and 5.65px mobile).

    How can I fix it?

    I send you, in private, the link to the page, some mobile screenshots and also password if neccessary.

    MANY Thanks in advance :)

    March 23, 2022 at 5:33 am #1345607
    Nikko

    Hi madakumbu,

    Please follow the instructions on this thread: https://kriesi.at/support/topic/enlarge-grid-row-pic-on-mobile/#post-1345412
    Hope this helps.

    Best regards,
    Nikko

    March 23, 2022 at 11:10 am #1345640
    madakumbu

    Many thanks Nikko,
    That works fine now!!

    But I have another doubt with another page.

    Fixing as you say: If the text block is over the background image, the text appears below on vertical mobile screen, although it is ok on computer screen. May I fix it somehow?

    I send screenshots exemples and link to the page

    Thanks again

    March 24, 2022 at 8:25 am #1345828
    Nikko

    Hi madakumbu,

    You’re welcome :)
    Please add this CSS code as well:

    @media only screen and (max-width:767px) {
  #top .av-layout-grid-container .no-padding .av_textblock_section {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
  }
}

    Best regards,
    Nikko

    March 24, 2022 at 10:50 am #1345843
    madakumbu

    Thanks a lot Nikko,
    It does not work, sorry. On mobile, the text keeps below , not center :(

    Regards

    March 25, 2022 at 5:15 pm #1346042
    madakumbu

    Hello @Nikko

    May I fix this issue somehow?

    Thanks a lot for your help
    Regards

    March 26, 2022 at 8:38 pm #1346150
    Mike

    Hi,
    Thank you for your patience, try changing the “bottom” to “40%” like this:

    @media only screen and (max-width:767px) {
  #top .av-layout-grid-container .no-padding .av_textblock_section {
    position: absolute;
    bottom: 40%;
    left: 0;
    width: 100%;
  }
}

    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

    March 28, 2022 at 10:03 pm #1346350
    madakumbu

    Hi @Mike
    Thanks for your answer and support, this is perfect now :)
    You can close this thread,
    Best Regards

    March 29, 2022 at 5:27 am #1346368
    Nikko

    Hi madakumbu,

    We’re glad that we could help you :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • The topic ‘Issue with GRID element’ is closed to new replies.