Skip Navigation

[Resolved] Masonry Bootstrap Grid View is resizing on refresh

The Toolset Community Forum is closed, for technical support questions, please head on to our Toolset Professional Support (for paid clients), with any pre-sale or admin question please contact us here.

This thread is resolved. Here is a description of the problem and solution.

Problem: I am using a Masonry plugin and displaying a Bootstrap Grid View on my site. When the page loads, the View is briefly shown wider than the container, and then flickers into the correct size. The same thing happens when I use any filter and submit to update the results.

Solution: The "container" class applied to your View appears to be the source of this resize issue. Remove it from your Loop Output to prevent the odd flicker.

This support ticket is created 7 years, 1 month ago. There's a good chance that you are reading advice that it now obsolete.
This is the community support forum for Types plugin, which is part of Toolset. Toolset is a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients and people who registered for Types community support can post in it.

Sun Mon Tue Wed Thu Fri Sat
8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 - -
13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 - -

Supporter timezone: America/New_York (GMT-04:00)

This topic contains 2 replies, has 2 voices.

Last updated by emilyr 7 years, 1 month ago.

Assisted by: Christian Cox.

Author
Posts
#580832

hi—

i've noticed that in the second after i use one of the filters i've created the grid view seems to resize itself, causing a momentary flash. i've not seen this before when i use views and wonder what i can do so that it immediately appears at the correct size and doesnt need to flash and resize.

any idea what i need to do?

view is here: hidden link
site password: beets

#580906
Screen Shot 2017-10-22 at 4.24.37 PM.png
Screen Shot 2017-10-22 at 4.23.14 PM.png
Screen Shot 2017-10-22 at 4.21.44 PM.png

Hi, it looks like this View has a div with the class "container" surrounding the Loop Output. Can you try to remove this class? When creating a Bootstrap-grid View, there is an option to add it or not, and if you already have a View created you should be able to just delete the "container" class in your View output. See the attached screenshots. Please let me know if this doesn't fix the flicker, and I'll take a closer look.

#581142

worked perfectly.. i'll be sure not to tick that box next time.

many thanks!

The forum ‘Types Community Support’ is closed to new topics and replies.