Team Members – Rows overlap

  • wnypa92 · Member ·

    Hi,

    After I’ve setup the team members (officers in my case); on the front page and on the team members page the rows do not display correctly upon first load. After refreshing the page the rows display as expected.

    Any thoughts on how to address this?

    See examples here: https://imgur.com/a/6czmI4u

    Thanks in advance

  • itsdavidmorgan · Theme Author ·

    Hello,

    Can you provide us with a link to the page so we can inspect your site and the code in detail?

    Thanks!

  • wnypa92 · Member ·

    Sure thing: https://www.wnypa.org/wp-login.php Please use guest account (expires 4/19/19) to view as the website is still being built. user: guest pass: guestg41919.

    You’ll see the issue right on the homepage. If you refresh the page try incognito mode or clearing cache to recreate the issue.

    Thanks in advance.

  • emilysuesrq · Theme Author ·

    Hello, the login had expired by the time we reached this reply. Please reset or provide link to view the page. Thanks!

  • wnypa92 · Member ·

    Apologies; user: guest pass: guestg050319

    Thanks for your patience

  • itsdavidmorgan · Theme Author ·

    Hello,

    The team members appear to display correctly upon first load for me, https://cloudup.com/cqimUnR686p

    What browser are you using?

    Also, try clearing the cache for your browser.

    Btw, great team member illustrations :)

    Thanks!

  • wnypa92 · Member ·

    Hi David!

    I thought about this just earlier today. I tried on IE, Edge, & Firefox just fine. It appears that Chrome is having the issues.

    Anytime I make a change to view or test I usually open an incognito window to avoid cache issues. And I’ve seen the issue on multiple devices with chrome.

    In your screenshot (and I’ve seen this too) do you also know why the second row item isn’t aligned left or right?

    Thank you very much! None of our members wanted to put their face on the page so I had to find something appropriate :D check out https://joeschmoe.io if you’re interested.

  • itsdavidmorgan · Theme Author ·

    Hello,

    I’m unable to log back into the site to do any testing in Chrome. It appears the login expired.

    However, fixing the alignment of the team member on the bottom may resolve the other issue that’s occurring upon loading.

    So, the reason that bottom team member is not aligning properly is because the featured images uploaded for each team member are slightly different dimensions. That team section uses a script called “Masonry” which organizes all members like puzzle pieces. So, if you have content of varying sizes, the team members stack in a way that doesn’t leave gaps.

    However, in your case you probably want to avoid that functionality since you don’t have a large number of team members. In short, ensure that all the featured image illustrations are exactly the same dimensions when uploading them.

    That should fix the alignment issue, and hopefully the loading issue as well.

    Thanks!

  • wnypa92 · Member ·

    Hi David!

    Thanks for taking another look. I appreciate the help thus far. The login is no longer needed. You should just be able to visit the site now at http://www.wnypa.org.

    I tried resizing all of the images so that they are the same and it doesn’t appear to make a difference with the overlapping, but it did help with the order they appear.

    My latest screenshots are here; https://imgur.com/a/fFX8Hbe it seems that Chrome and Safari are the only two with issues.

  • itsdavidmorgan · Theme Author ·

    Hello,

    No problem. :)

    I see the issue. I committed an update to the theme that changes the load order of that Masonry script. Hopefully, that resolves the issue. However, WordPress.com has to approve the theme update. So, it might take a couple days before the update is pushed.

    Try clearing your browser cache in a couple days, and loading the page again. Let me know if that works. If it doesn’t, we’ll try something else.

    Thanks!

  • wnypa92 · Member ·

    Thanks David! I’ll keep an eye out for the update.

    Appreciate all the help.

  • emilysuesrq · Theme Author ·

    You’re welcome!

  • The topic ‘Team Members – Rows overlap’ is closed to new replies.