Streaming live at 10am (PST)

Issue with a class on all devices


#1

Hi guys,

I’m having troubles with a class that’s behaving strange across the four media queries.

I 've done a screengrab to illustrate https://vimeo.com/306217862

The preview is here, you can test the behaviour of the info div by resizing the browser window:
https://primavera-upform.webflow.io/project-1

The Webflow project is here:
https://preview.webflow.com/preview/primavera-upform?utm_source=primavera-upform&preview=4ded26b67d1145981f0e9c51579c5662

Thanks!

Marius


#2

Hi @unksup

Thanks for posting about this.

I took a closer look at your project. It looks like in the Style Panel, you have this project info copy element set to display:flexbox:

However, in the show/hide interaction, you have the project info copy element being set to display:block:

If you change the display setting to flex in the interaction, the issue should be resolved.

Hope this helps :slight_smile:


#3

Hi Brando,

Thanks! This solved the issue for the desktop version. I learned something new today :slight_smile:
However, the issue is still there for the mobile portrait. I checked the display setting and it’s flexbox.
Also, now the page loads the detailed info by defauls, but it’s set up as display=none.

Spent half a day trying to figure these out but with no success. Next time I’ll be posting my issues on the forum, in order to save time and learn new stuff.

Thanks again!
M


#4

The issue is still there for the mobile portrait. I checked the display setting and it’s flexbox.
Also, now the page loads the detailed info by defauls, but it’s set up as display=none.

I checked the site in preview mode once more and it looks like both of these are resolved now — were you able to get this working as expected?


#5

Hi Brando,

Yes, I solved the alignment issue by moving the X button inside another DIV.

I now have another issue though, but I opened another discussion about it.

What might be very useful for me is to find out what’s the governing principle here, because it seems like animated elements change expected behaviours, not only display type.

So what’s the best thing to do when something doesn’t work as expected? Reload the project, unpublish it and republish it? Sometimes a poor internet connection makes elements not behaving correctly, and I find myself forced to just come back a little later. I’ve exeperienced a few dozen frustrating issues (situations, or bugs), what would be the most effective way to approach them?

Thanks,

M


closed #6

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