My gallery displays differently in different browsers. On Chrome it looks the way I want it to have - 3 columns, full width. But on all other browsers - Edge, Opera, Firefox it's only 2 columns. I attach the screenshots.
How could I change it to be displayed the same on all browsers, please? When I change the layout to 3 columns, I get the white sides of the container, but I would like to keep it fullwidth. Just to add, the row setting is set to full width. Please could you advise?
Please publish the page and then check as from the screenshot it seems you are Previewing the page in Chrome and loading the saved version in the other browsers.
The page was published when I made the screenshots. I just wasn't logged out. Here a the screenshots from today. The gallery looks the same as before - on Chrome it looks OK, on all other browsers - no.
Oh, I didn't notice it. But maybe there is a way to fit three columns in a fullscreen, please? When I choose the 3 column layout the gallery is placed into a container and white sides are visible - screenshot attached. The row itself is set to 'Ful width content'
The Image Gallery is being placed inside a Tab Element, which could influence this behavior. Could you let us know how do you want it to appear so we can guide you on whether its possible at the moment.
By Default the Image Gallery Thumbs are divided into 5 or 4 columns, however using the css below you can divide the Wide and Wide+Tall Thumb into 3 columns.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
@media only screen and (min-width: 1300px) and (max-width: 1600px) {
body .wpb_gallery_slidesimage_grid .portfolio-items .col.elastic-portfolio-item.wide_tall {
width: 33.3% !important;
}
body.wpb_gallery_slidesimage_grid .portfolio-items .col.elastic-portfolio-item.wide {
width: calc(33.3% - 8px) !important;
}
}
Hello
My gallery displays differently in different browsers. On Chrome it looks the way I want it to have - 3 columns, full width. But on all other browsers - Edge, Opera, Firefox it's only 2 columns. I attach the screenshots.
How could I change it to be displayed the same on all browsers, please? When I change the layout to 3 columns, I get the white sides of the container, but I would like to keep it fullwidth. Just to add, the row setting is set to full width. Please could you advise?
Hi There,
Please confirm that your salient theme(latest v12.1.6) and wpbakery (latest v6.4.2) are up to date.
Thanks.
I can confirm, that WP bakery is 6.4.2 and we updated the theme not long ago too (v12.1.6).
Hey Again,
Please publish the page and then check as from the screenshot it seems you are Previewing the page in Chrome and loading the saved version in the other browsers.
Thanks
ThemeNectar Support Team
Hi Tahir
The page was published when I made the screenshots. I just wasn't logged out. Here a the screenshots from today. The gallery looks the same as before - on Chrome it looks OK, on all other browsers - no.
Your Chrome Browser is zoomed out :
ThemeNectar Support Team
Oh, I didn't notice it. But maybe there is a way to fit three columns in a fullscreen, please? When I choose the 3 column layout the gallery is placed into a container and white sides are visible - screenshot attached. The row itself is set to 'Ful width content'
Hey Again,
Try using "Constrained FullWidth" Option and check.
Thanks
ThemeNectar Support Team
Then I get two columns only and the container sides are there. See screenshot.
Hi RanebrookZina,
Please send in your admin login credentials so that we may look into this further
Thanks.
Hey Again,
The Image Gallery is being placed inside a Tab Element, which could influence this behavior. Could you let us know how do you want it to appear so we can guide you on whether its possible at the moment.
Thanks
ThemeNectar Support Team
Hi Tahir
I would like it to look like in the screenshot. With the tabs on top, the gallery is as a fullscreen.
Hey Again,
By Default the Image Gallery Thumbs are divided into 5 or 4 columns, however using the css below you can divide the Wide and Wide+Tall Thumb into 3 columns.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Thanks
ThemeNectar Support Team
I added the CSS code, but nothing changed - https://www.ranebrook.co.uk/gallery/
You need to set the layout to fullwidth in here as well:
Thanks
ThemeNectar Support Team
I changed it to Fullwidth, now there are two columns only, the CSS code didn't help.
check now.
Thanks
ThemeNectar Support Team
It worked. Thank you!!!