Form elements disappears on mobile

Hello Helle,

I checked your site on my mobile and it shows all the fields, please see

Have you managed to solve this?

kind regards,
Kasia

Hi,

You have to remove the slidein and take a look at the embed fields in behind. It’s here the problem is.

Best regards.
Helle

Hi Helle,

This usually happens if you have fixed size set so the embed is not responsive anymore but it rather uses the fixed size that you’ve used.
Can you try going to your embed in backend, go to Design tab and in there disabled “Custom embed size” option, if it’s enabled and that should do the trick.

Cheers,
Predrag

Hi,

I’m sorry but that doesn’t work.
Can’t some css styling do the trick?

Cheers,
Helle

Hello there @hellesuhr,

could you please try out the following CSS snippet?

@media screen and (max-width: 480px) {
  .module_id_3 .hustle-modal {
    width: 100% !important;
  }
  .module_id_3 .hustle-modal-two .hustle-modal-optin_form {
    display: block !important;
  }
}

Let us know how that goes or if you’re having any difficulties with that. ??

Thank you,
Dimitris

Hi,

Thanks for your reply.

Now I can see all form elements, but I also want the form elements to be beneath each other.
How can I do that?

Cheers,
Helle

Hello there @hellesuhr,

Could you please export the module settings as shown here:
https://take.ms/TUbHd
And share these with them here in your next reply? You can use a service like Dropbox or Google Drive for doing that.

Thank you,
Dimitris

Hi,

Here is a link to my module settings: https://www.dropbox.com/s/7sbxzg3sfkjaiqw/Billig-hjemmeside-spar-2000-kr.json?dl=0

Cheers,
Helle

Hello @hellesuhr,

please add the following code in Appearance -> Customize -> Additional CSS:

@media screen and (max-width: 480px) {
  .module_id_3 .hustle-modal {
    width: 100% !important;
  }
  .entry-content .module_id_3 .hustle-modal-two .hustle-modal-optin_form {
    display: block !important;
  }
}

I tested it with your own embed settings and works well (doesn’t when used in the embed custom CSS though).

Warm regards,
Dimitris

Hi,

Thanks for the reply.

Unfortunately it dosen’t make any changes when i ad the code. The form fields are still beside each other. The code is almost the same as I got earlier. That’s going wrong?

I really hope we can solve this problem.

Cheers,
Helle

Hello there @hellesuhr

Could you please send me an email to [email protected] using this template:

Subject: “Attn: Dimitris”

Message: link back to this thread for reference

Keep in mind the subject line as ensures that it gets assigned to me.

Thank you,
Dimitris