Envira gallery not centered on mobile

Support
#1

Hi,
I’m having trouble centering the envira gallery on mobile devices. It tends to stick to the left side.

Thank you,
Anita

#2

Hello @Anita_Mediana,

Thanks for asking. :slight_smile:

Please walk-through following steps to center align the images:

  1. First, please add a class name to the Content Band (as you are using Visual Composer) that’s holding Envira Gallery items. Here’s a tutorial that you can refer.

https://visualcomposer.io/help/content-elements-structure/element-id-extra-class-name/

  1. After that add following CSS under X > Theme Options > CSS:
.center-image .envira-gallery-wrap .envira-gallery-public {
    display: grid;
}

Please replace center-image class name as per requirement.

1- I have found the proper CSS code selector using the Chrome browser Developer Toolbar: https://www.youtube.com/watch?v=wcFnnxfA70g

2- For the CSS code itself, I suggest that you get started with this tutorial: https://www.youtube.com/watch?v=yfoY53QXEnI

Thanks.

#3

Ok, I’ve done it. Only now the images are too big, they don’t have nice definition as before.

#4

Hi There,

To fix this issue, please add this custom CSS under Theme Options > CSS:

img.envira-lazy {
    width: auto;
}

Hope it helps :slight_smile:

#5

Hi Thai,
thank you but it did not help, the images are still the same.

Regards,
Anita

#6

Hi Anita,

Please update the previous CSS to this:

body img.envira-lazy {
    width: auto !important;
}

If it still doesn’t help, please provide us with login credentials(by clicking on the Secure Note button at the bottom) so we can take a closer look? To do this, you can make a post with the following info:

  • Link login to your site
  • WordPress Admin username / password

Thanks.

#7

Hi Thai,
I gave you the credentials of the site.
One other issue that I’m having is the update of the Theme Pro. Practically when I update it all the columns/content bands from the WP Bakery Page Builder (I’ve made all my pages, except posts, with this builder) are a mess. WordPress cant figure out which ones are not visibile on desktop and which ones on mobile and it shows all of them, images get too big, the columns are full width and not contained… Can you explain what to do in order to maintain the same style of my site after the update?

Thanks/ Regards,
Anita

#8

Hi Anita,

When updating always make sure to clear your plugin cache and browser cache.

It’s possible to implement the update, and not have it take place because a cached version of the page or various resources are loading instead of the latest version.

Please refer to the links below for your guide


Thanks

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.