Cookie policy page messed up styling

Hi @umutusu,

Can you try enabling the document css in complianz/settings?

That should improve the styling.

Not sure what you mean with the white space, can you share your domain so we can check it?

After enabling “Use document CSS by Complianz”, the styling of the cookie list gets better but the added white space is still there.
As you can see in the added video capture of the page, only the expanding/contracting of the miscellaneous tab causes/solves the white space after the footer of the page
Here is the video capture: https://we.tl/t-6IxTo7hB7W
Thanks for your help

But I actually don’t like Complianz’s general styling of the page (which doesn’t match the rest of the website) so I prefer disabling it.

And also, the styling of the cookies list was way better before.

and here is the link to the website. It’s a development website.
https://www.umutusu.xyz/privacy-hub/cookie-policy-eu/

The old structure was based on a table /tr /td structure. The advantage, as you have noticed, is that a table structure does not necessarily require CSS, and most themes have some CSS built in to make a table look nice.

The problem with a table structure is that it is not very suitable for smaller screens. The old design didn’t display very well on mobile devices.

For this reason we have changed the structure to the more flexible CSS grid design, which shows up nicely on mobile devices as well.

Based on your feedback I will ask our designers to have a look at how the basic structure can be made to look better while adding as little colors or font styles and sizes as possible.

For example, you could add a border to the service headers, like this:

#cmplz-document .cmplz-service-header {
    border: 1px solid black;
    padding: 0 21px;
}

This will outline the headers more.

I see the white space on your screenshot, but cannot reproduce this locally. It might be theme related. If you can share your domain, or send it to support(at)complianz.io we can check where this is coming from.

Thank you. I’ll try the css.
And here is the link again https://www.umutusu.xyz/privacy-hub/cookie-policy-eu/

Sorry, missed your link the first time…

It looks like the visibility:none/height:0 in combination with your theme causes the height issue. I haven’t seen it before, possibly there’s some javascript recalculating the height.

It looks as if using “display:none” would fix the problem. I’ll get back to you fix tomorrow.

Can you try if adding as custom css

#cmplz-document .cmplz-service-desc.cmplz-service-hidden {
    visibility: initial;
    height: initial;
    display:none;
}

resolves your white space issue?

After testing, this will get merged into the next release.

Hi Rogier,
Yes, it worked.
Thank you
So, with the next update, I’ll remove the CSS because it will be merged?

Yes, I’ll get it merged in the update for Monday.

Great!
Thanks again

Updated and works.
Thank you