How can I make the announcement bar sticky on mobile with Dawn theme?

[reallycoollivin]

Help! I need the announcement bar sticky on desktop and mobile, but can only seem to get it to work on desktop using the forums here. Can anyone help?

[reallycoollivin]

There is not a 'display' tab nor anything that says 'responsive' in the announcement bar settings.

[colb_32]

Looks like you got this resolved! I'm having the same issue, how did you resolve?

[Abdosamer]

Hi @reallycoollivin , can you share your store url?

[reallycoollivin]

https://www.reallycoolliving.com/

[Abdosamer]

Go to base.css and add the following snippet :

@media screen and (max-width: 640px) {
      .announcement-bar-section {
       position: sticky;
       top: 0;
}
}

[reallycoollivin]

Just tried and it does not work. I left it published so you can check.

[Abdosamer]

It seems that other code overwriting my code , add the following snippet :

@media screen and (max-width: 640px) {
      .announcement-bar-section {
       position: sticky !important;
       top: 0 !important;
}
}

[reallycoollivin]

Doesn't work

[Abdosamer]

Try this :

.announcement-bar-section {
    position: sticky !important;
    top: 0 !important;
}

[reallycoollivin]

exactly what I had before, sticky on desktop, but not mobile.

[NijaMama]

Did you ever get an answer to this?