• Resolved ImageJames Monroe

    (@jhmonroe)


    For the <form> element with class mc4wp-form or mc4wp-form-basic:

    I tweaked the CSS a bit to shuffle the inputs around on desktop vs mobile, however the parent container has a ton of extra space at bottom on desktop. How is it calculated? I can’t find anything like min-height that would be causing the parent to be so tall from all the children inside… stumped!

    https://nesfl.org/home-2025/?theme=nesfl

    I tried lots of troubleshooting with Claude Code too but it can’t quite see everything on live site I guess

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Contributor ImageLap

    (@lapzor)

    The container the form is in is set to display: flex
    with align-items: stretch;

    So the container will take up the “original” amount of space, but the items inside it will be stretched which reposition them to take up less space.

    I recommend using a different approach such as media queries instead of the align-items: stretch.

    We won’t be able to give further support with custom CSS like this as the CSS code you need help with isn’t actually part of our plugin and we do offer a “styles builder” in the Premium add-on that will help you set these sort of styles trough the settings interface without writing any code.

    Kind regards,

    Thread Starter ImageJames Monroe

    (@jhmonroe)

    Thanks so much for the tip! Appreciate it. WordPress FSE really is bloated with CSS coming from global styles, block styles, etc. really a labyrinth to find things.

    Ended up applying width:100% to .mc4wp-form-basic which works like a charm with the tangle of CSS from core/base theme

    This is a tiny nonprofit so I can’t put them on any paid SAAS but will def keep it in mind for bigger clients! Your plugin is so much better and easier than using the actual Mailchimp plugin!

    Thanks again! You’re a saint

Viewing 2 replies - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.