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

Store Design
, , ,
1

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?

2

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

1 Like
3

Hi @reallycoollivin , can you share your store url?

4

https://www.reallycoolliving.com/

5

Go to base.css and add the following snippet :

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

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

7

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;
}
}
8

Doesn’t work

9

Try this :

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

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

11

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

12

Did you ever get an answer to this?