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

    Hello Team

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

    I have done the following steps that you told me about another topic some time ago:

    1- I have added an image inside those grids (same as the background) then hidden it in large screens and medium sized screens in Element Visibility (under Advanced > Responsive).
    2- And in the cell that contain the image, I added no-padding in Custom CSS Class (under Advanced > Developer Settings).
    3- Then added this CSS code in Enfold > General Styling > Quick CSS.

    @media only screen and (max-width:767px) {
    .responsive #top #wrap_all .av-flex-cells .no-padding {
    padding: 0 !important;
    }
    }

    It looks fine on the computer screen, but not on mobiles on VERTICAL position (tested on 6,55px and 5.65px mobile).
    How can I fix it?

    I send you, in private, the link to the page, one mobile screenshot and also password if neccessary.
    MANY Thanks in advance :)

    #1351469

    Hey Magdalena,

    Thank you for the inquiry.

    Are you referring to the padding surrounding the image? Please try to add this css to remove the default padding of the cells. Make sure to add the code inside the existing css media query for mobile view.

    .responsive #top #wrap_all .av-flex-cells .no_margin {
        padding: 0 !important;
    }
    

    Best regards,
    Ismael

    #1351527

    Thanks @ismael

    It is ok , now it works perfectly :)

    Otherwise, now, another page with two grids and background images and text appears very “little” on MOBILE LANDSCAPE;
    Before today it was ok

    How can I to fix it again?

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

    Regards

    #1351590

    Hello @ismael
    I have added the custom code you said, with the code block element directly inside the page
    It has well worked,

    This is what I have added:
    <style>
    .responsive #top #wrap_all .av-flex-cells .no_margin {
    padding: 0 !important;
    }
    </style>

    So please, forget my last question so you can close this thread
    Thanks for your help
    Regards

    #1351763

    Hi,
    Glad Ismael could help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

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

The topic ‘GRID element and background images’ is closed to new replies.