Support » Plugin: Grids: Layout builder for WordPress » Setting L/R margins on grid divs for mobile viewports is pointless right now

  • Resolved ascobol

    (@ascobol)


    Thnk you Evolve for such a great plugin, I sincerely hope you’ll continue to work on it because it has AMAZING potential.

    I’m using the custom grid to slightly overlay a short, colorful caption paragraph over a part of a large image (the image and the paragraph being separate grid divs). This looks great but I wanted to keep the paragraph overlaid over the bottom of the image even on mobile, without it having a full page width. Fine, I added a negative top margin. But adding a left or right margin to a grid item on mobile just pushes it over the edge of the viewport right now because it’s set to 100% width on mobile screens (in frontend.css).

    Hoping you can change this in the next update, maybe just change it to max-width: 100%;.

    Also it would be great to be able to choose different units when setting margins and padding, like rem or vh.

    Thanks again!

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Contributor simo_m

    (@simo_m)

    Hello there,

    first of all, thank you for your kind words, we really appreciate it!

    Thanks for reporting, we will release today a new update with a potential fix for this issue, but if you can share with us a link to your page we can analyze better your specific problem.

    Concerning your last question, every input field for a measure support multiple unit values (https://justevolve.it/grids/wp-content/uploads/2019/06/grids_unit_value.gif).

    Thanks again for your feedback.

    Regards,

    Simone

    Thread Starter ascobol

    (@ascobol)

    Great! And thanks, totally didn’t notice that the ‘px’ unit was a drop-down menu.

    I am just playing around on localhost but if I do run into any problems in the future I’ll post here.

    Cheers!

    Plugin Contributor simo_m

    (@simo_m)

    Let me know if the new update fix your issue 😉

    Simone

    Thread Starter ascobol

    (@ascobol)

    Okay, so this is my playground for messily testing new plugins and ideas:

    http://901fd7b3.ngrok.io/12-2

    The issue persists– take a look at the green and the blue paragraphs under the images on mobile. The margins still push them off the screen.

    @media screen and (max-width: 768px) {
        div[class^="grids-a-"] {
            width:100%;
        }
    }

    Either commenting that out in your frontend.css or changing it to max-width solves this particular problem, I don’t know what else it could affect though.

    Plugin Contributor simo_m

    (@simo_m)

    Hello there,

    thank you for the link!

    We have fixed this issue and will be included in the upcoming 1.2.6 update 😉

    Thanks again for your valuable feedback!

    Best,

    Simone

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Setting L/R margins on grid divs for mobile viewports is pointless right now’ is closed to new replies.