Support » Plugin: GDPR Compliance for Mailchimp » Check box for GDPR text not aligned

  • Resolved Andrew M


    The form, which is in the sidebar, has the checkbox out of alignment with the GDPR text. I have tried to change the text formatting, without any success, and would like to know if there is a fix for this, or a custom style to get this working better.

    An annoyance rather than a major issue – but does make the website look less professional.

    It would be nice if there were a way to have more control over the formatting within the form as well, but that is not critical.

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

Viewing 6 replies - 1 through 6 (of 6 total)
  • Hey @andrewlmacaulay,

    I could help you out with some custom css. How do you want it to look? Do you want the box to be flush with the top of the text?

    – Freddie

    Thread Starter Andrew M


    Ideal would be bottom line of checkbox lining up to natural bottom of first line (i.e. Bottom of e.g. A) but top lining up would certainly be better than it is now.


    Sorry for the late reply I had an issue with my emails not showing me all of these tickets! If you’d like to align a checkbox with the bottom of text there is a CSS property that you could use.

    I see in your theme’s stylesheet that text boxes are styled with the following:

    display: inline-block;
    margin-right: 0.22222222em;
    padding: 0;
    position: relative;
    top: -0.16666667em;

    This top property is controlling your checkbox position. We can override that but another thing you should know is that a checkbox is different in each browser. If you look in Chrome, Firebox, IE, Opera etc. you’ll see they’re all slightly different.

    This article by Mozilla can show you how css could be interpreted differently for each browser for inputs. This doesn’t mean you can’t style the checkbox, it just means you’ll have to work at it a little bit to make sure its looking good in all the major browsers.

    The CSS property that could help you is:
    vertical-align: text-bottom;

    With this property you can set the bottom to align with the texts bottom. Most people opt for vertical-align: middle; because text-bottom accounts for letters which hang like y or g. The text bottom is flush with the lowest hanging letter.

    I was playing with your css and it seems like you could just adjust the top: -1px; and that would set your checkbox where it needs to be.

    If you’re not sure how to add custom css you can use a plugin.

    The selector you could use would be:

    label.yikes-mailchimp-eu-compliance-label > input[type=checkbox] {
        top: -1px;

    You can also add this through the Customizer in WordPress. If you’re looking at your website while logged in just click Customize in the WordPress toolbar.

    If you’re in the admin you can go to Appearance > Customizer. Once you’re in the customizer you’ll see that there is a section for Additional CSS that you can add to your theme.

    Just copy that code in there and watch your checkbox change as you manipulate it. Change the number and remember that you can use a percetage for the number like -1.00023px if you wanted to get that fine grain.

    Best advice is just to open your site up in a few browsers and see what adjustments work best for all browsers.

    You can also use your browsers developer tools to play with the styling. In most major browsers you can right click and choose Inspect and you’ll see the code for the website. Just right click on the checkbox and inspect. You’ll see all of those styles I listed above. Manipulate them change the numbers see what everything does and you’ll be able to have it looking exactly how you like.

    Let me know if you have any questions I have my notifications for these posts fixed!



    Thread Starter Andrew M


    Thanks – I’ll have a look at this in the coming days.

    Thread Starter Andrew M


    Thanks – played with it a bit myself using your suggestions and have managed to get it looking better now.

    Awesome, thats good to hear!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Check box for GDPR text not aligned’ is closed to new replies.