Cookiebot buttons not aligned correctly on Webflow site

Design help Custom code
1

Hi community,

I’m running into an issue with a Cookiebot implementation on my Webflow site.

The banner itself loads correctly — the text and tabs (“Consent”, “Details”, “About”) all work fine — but the buttons are stacked vertically instead of being displayed next to each other.

I’ve attached two screenshots for reference:

  • Beeldspraak.nl → buttons are stacked (incorrect layout)

  • Cookiebot design → buttons are side-by-side (correct layout)

The Cookiebot admin setup and script are identical, and there are no console or network errors.
That makes me suspect that Webflow’s global CSS is overriding Cookiebot’s layout — maybe something related to flexbox or button container styling.

Has anyone run into this before?
And if so, what’s the best way to isolate third-party embeds (like Cookiebot) so Webflow’s global styles don’t interfere with their default layout?

Thanks in advance for any ideas or workarounds!

Cookiebot beeldspraak kapot
Cookiebot beeldspraak kapot982×575 70.5 KB

image (6) (1)
image (6) (1)1386×478 35.5 KB

1 Like
3

Hey @Timtobefound ,

Yes, the styling is coming from the ul and li selectors. You can probably add the following styling inside the Head tag of the site to override this setting.

<style>
  .CybotCookiebotDialogNavItems {
    flex-direction: row;
  }
  .CybotCookiebotDialogNavItem {
    display: block;
  }
</style>

Hope this helps.

1 Like