[Support request] Problem with CSS styles in Hook

[Douglas]

Hello, I have a problem with the Generate Press elements. I have a section (template) that I activate according to the category of the item. I have created a Hook to work with Elements.

On desktop everything perfect, the problem is on mobile, Elementor has the option to Regenerate CSS Styles, this works, but only regenerates the styles in a category.

I did the test putting directly the section, without Elements, and the responsive goes well. I think it is a problem of the GP Premium plugin with Elementor.

I don’t think it’s the custom Hook, as on another site I’m using the same logic but directly with a GP Hook.

Could you guys give me a hand with this?

[David]

Hi there,

i am not noticing any difference between the responsive behaviour across those 4 URLS.
Is it on a specific device or browser? Have the browser caches been cleared ?

[Douglas]

I have deactivated plugins and removed everything that is cache. Here are two links in PRO, please check them in mobile. They are the links where I have the errors. 🙂

Can you see the error?

[David]

So i checked the first link la-adelita-botanero on my iphone in Safari, and i can see you have some narrow columns.
Using the developers tools to inspect my mobile safari i see this:

As you can see all the CSS is coming from Elementor, and the column width 100% rule for mobile is being overwritten by the desktop CSS rule that is more specific.

So i can’t see what GP has to do with it. Have you checked with Elementor support ?

[Douglas]

Yes, Elementor is working well in the first instance. The first 4 links I shared with you have the same error. For example /top-10-contact-form-plugins/ on mobile does not show the positions it should. On the other hand /3-awesome-security-plugins-for-wordpress/ this other post does. That’s because when the solution is done from elementor, it only applies an layout. https://prnt.sc/PRMf0l4cqJW5

[Douglas]

For example, so as I see in one case, https://prnt.sc/mh0OOeopvanR and in the case that it does show the styles well I see it like this https://prnt.sc/Uemjytb3PZ1u

[Douglas]

When testing, the error occurs when I use the hooks 🙂

[Douglas]

Responding to the image you shared with me, the error is the same in both of them, it doesn’t get the CSS styles right in all of them, only in one. And it is because of the Hook. If I don’t use the Hook, the elementor responsive is fine. 🙂

[Douglas]

In the case of the image you gave me, I have two of the same hook with different rules, i.e., it is displayed according to category. But the hook is having a problem of incompatibility, could it be? https://prnt.sc/Q8Eqr0XRALRP

[David]

You need to check with Elementor support.
The Theme has no influence over how Elementor generates its CSS.
And as you can see from my screenshot:

https://generatepress.com/forums/topic/problem-with-css-styles-in-hook/#post-2223645

The CSS is 100% from Elementor.

[Douglas]

Just one detail, if you click on https://prnt.sc/PRMf0l4cqJW5 you will notice that the correct display will change.

[Leo]

As David mentioned, you will need to check with Elementor’s support on this.

Please be mindful of what we can support here:
https://generatepress.com/what-support-includes/

Thanks for your understanding 🙂

[Author]

Posts