Support » Plugin: Easy Forms for Mailchimp » Placeholder text in IE 11 and Firefox

  • Resolved mkearney

    (@mkearney)


    The form looks great in Chrome, but when viewing in IE 11 the placeholder text slips down and only the top of it is visible in the field.

    With Firefox it just shows a series of dots.

    Is there any way to fix this? I like it better than labels.

    Thanks

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Contributor yikesitskevin

    (@yikesitskevin)

    Hi @mkearney,

    I took a look at the form in Firefox and there are some conflicting styles between the plugin and your theme (unfortunately I can’t look at the form in IE because, even with a Windows computer, IE doesn’t work on my computer).

    The fields have a height of 20px which is conflicting with a padding that we’re setting on the fields. You have two options: either change the height of the fields or remove the padding we’re setting.

    Here is some CSS that would override our padding:

    .yikes-easy-mc-form input[type="text"], .yikes-easy-mc-form input[type="url"], .yikes-easy-mc-form input[type="email"], .yikes-easy-mc-form input[type="number"], .yikes-easy-mc-form select {
    	padding: 0 !important;
    }

    Let me know if you need help adding custom CSS.

    Cheers,
    Kevin.

    Thread Starter mkearney

    (@mkearney)

    Hi

    I added the css but it didn’t seem to make any difference. For now I have taken the placeholders out and will use the labels. Hopefully I will get back to this in a few months time and will be able to sort it out properly.

    For now, thanks for all your help.

    Cheers

    Thread Starter mkearney

    (@mkearney)

    Hi. I’ve got the customiser add-on now and am setting up my form. It looks great in Chrome, but again I’m having problems with IE and Firefox.

    How do I change the height of the input fields?

    I find the input text displays OK if it is 10px, but if I make it larger then you can’t actually see what you’ve typed. I would like to use a bigger font size if possible, but can’t seem to make the field taller to display the larger font.

    Plugin Contributor yikesitskevin

    (@yikesitskevin)

    Hi @mkearney,

    FireFox and Chrome are behaving differently and it took me a while to figure something out but I think I got it. Try using this custom CSS.

    .yikes-easy-mc-form input[type="text"], .yikes-easy-mc-form input[type="url"], .yikes-easy-mc-form input[type="email"], .yikes-easy-mc-form input[type="number"], .yikes-easy-mc-form select {
        padding: 0 !important;
        height: 40px;
    }

    Also, as a premium member you can create premium support tickets with us! Here is an article from our knowledge base explaining how to create a ticket: https://yikesplugins.com/support/knowledge-base/how-do-i-get-premium-support/

    Let me know how that goes.

    Cheers,
    Kevin.

    • This reply was modified 3 years, 3 months ago by yikesitskevin.
    Thread Starter mkearney

    (@mkearney)

    Works like a dream! Thank you!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Placeholder text in IE 11 and Firefox’ is closed to new replies.