Cookie banner too large on mobile

Store Design
,
1

Hi everyone,

I’m having an issue with my Shopify store: the cookie banner is too large on mobile devices and covers a big part of the screen.

How can I resize or adjust the cookie banner so it fits better on mobile? Is there a way to fix this in the theme settings or do I need to use custom CSS?

Thanks in advance for your help!

website

2

Hi @PeppePro02 ,

It’s appearing perfectly fine on my mobile. Please send a screenshot so that I can understand your issue more easily.

Thanks!

3

Hi @PeppePro02,

I found the cookie consent banner which takes 50% of your mobile device appearance..

It can be fixed from theme settings or custom css as well. can you tell me which theme you are using it.

so I can review it and give you solution accordingly.

Thanks!

4

Hi,

Hope this will help

  • Check for Cookie Banner Settings
  • Add Custom CSS to Fix It

CSS example

/* Fix oversized cookie banner on mobile */
@media screen and (max-width: 767px) {
  .cookie-banner, .cookie-bar, .gdpr-banner { 
    font-size: 14px !important;
    padding: 10px !important;
    position: fixed;
    bottom: 0;
    width: 100%;
    max-height: 20vh; /* only 20% of screen height */
    overflow-y: auto;
    z-index: 9999;
  }
}
5

Yes, I’m using the Dawn theme. I would like to make it a bit smaller. By the way, do you think it looks fine as it is now, or would it be better to make it smaller? Thanks!

6

Hi @PeppePro02 ,

It looks like still taking half of the mobile screen. let me know if you still need help. Its just required to make a button smaller so that will be show small in mobile.

Thanks!