I'm trying to embed my type form on my website. As you can see, this works beautiful on Desktop at: https://ztxadvisors.com/contact-us/
However, when I try to view the same page on mobile, if you visit the same link (https://ztxadvisors.com/contact-us/) the form doesn't show up. Can you please help?
Best answer by mathio-tf
I see there are other elements obstructing your typeform. You can try using data-tf-inline-on-mobile attribute (see this help article).
We are aware of the limitations of embedding typeforms on some websites due to conflicting CSS or other elements. We are currently working on improving the mobile experience and resolving the conflicts for additional cases. Thank you for reporting this issue, we will try to include a fix for your case too.
+5
I know Divi allows for certain views on desktop/mobile which may be the cause, but he can help me confirm what the issue is.
+5I see there are other elements obstructing your typeform. You can try using data-tf-inline-on-mobile attribute (see this help article).
We are aware of the limitations of embedding typeforms on some websites due to conflicting CSS or other elements. We are currently working on improving the mobile experience and resolving the conflicts for additional cases. Thank you for reporting this issue, we will try to include a fix for your case too.
Was this ever resolved? I am using Divi too and tried the data-tf-inline-on-mobile suggestion but it did not solve my problem. My typeform does not let the user scroll correctly all the way down to the end of the page on the mobile version: https://jamielynntatera.com/feelings-habit-animal-quiz/
Please advise.
+5Hi
the issue you are facing is specific to the CSS used on your website. Sometimes other elements can be displayed over.a typeform and there is nothing we can do to affect this behavior (sometimes it is even something our customers want).
In your specific case, I tried adding this CSS to your footer.et-l.et-l--footer and it seems to have resolved the issue:
z-index: -1;
position: absolute;
width: 100%;Can you please try this?
Where do I find my footer.et-l.et-l--footer file? I don’t have a child theme. I have just been using the additional CSS to add any custom coding. I tried adding it there but it didn’t work. What am I missing? Thanks!
+5Try adding this to your additional CSS 🤞
footer.et-l.et-l--footer {
z-index: -1;
position: absolute;
width: 100%;
}Hope this helps.
This worked! Thank you, so much, Mathio for your assistance (and patience).
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.
