Cookie banner width issue

  • Resolved barbaree

    (@barbaree)


    2 years, 4 months ago

    Hello,

    I’m having an issue with cookie banner width size since the last major update of the plugin. I wanted it to be in the center of the screen with the minimum size of 300px width. Whatever I do, the width takes like half of the screen’s width, as if it doesn’t take the number of px in consideration. It only makes text narrower, but not the box. Could you maybe help me with this, please?

    Thank you,

    Kind regards,

    Barbara

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Contributor Aert Hulsebos

    (@aahulsebos)

    Hi @barbaree,

    I think it’s the total width of the buttons.

    You can do a couple of things:

    First, enable Custom CSS (Cookie banner settings) and enable the option that fixes auto-correction on width.

    Then you can set the width to a minimum of 428px without changing anything. If you want to have it on 300px specifically, you will need some custom CSS:

    You can start here; https://complianz.io/css-lesson-21-stacking-buttons-on-the-new-cookie-banner/

    If you can share your URL and tell me what you would like with these elements, I can propose the CSS myself.

    Regards Aert

    Thread Starter barbaree

    (@barbaree)

    Hello @aahulsebos,

    Thank you for your quick reply.

    I have done everything what you proposed, but the white space on the right side is still there. I think it must be something with display, grid of the cookie banner box – container. The text is still stretched, but the buttons are nicely stacked after using the css code. You can see for yourself on: https://puntxka.com

    I would just like to have a more “square” cookie (not too big) with stacked buttons and text aligned in the same column/grid above if possible.

    Thank you for your help, appreciate it.

    Regards,

    Barbara

    Plugin Contributor Aert Hulsebos

    (@aahulsebos)

    Hi @barbaree,

    Could you try some CSS:

    .cmplz-message, .cmplz-categories {
    width: calc(var(--cmplz_banner_width) - -30px);
    margin-top:10px
}

.cmplz-cookiebanner .cmplz-buttons {
    width:unset;
    margin-top:-20px
}

    When I use this in the inspector I get; https://snipboard.io/XaDTSh.jpg

    regards Aert

    Thread Starter barbaree

    (@barbaree)

    Hi @aahulsebos,

    Thank you so much for this css rule, it looks really nicer now! You’re great!

    Have a nice day,

    Kind regards,

    Barbara

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Cookie banner width issue’ is closed to new replies.