Hide a button on the announcement bar in mobile view

Technical Q&A
1

I need to hide my gift voucher button in the mobile view…

**FASTEST DELIVERY**: Friday, 12 March. Order within 0D  20H  16M 1S

  

 GIFT VOUCHERS

This is my attempt:

@media screen and (max-width: 600px) {
#shopify-section-announcement-bar p.buttons {
display: none; /* Hide the button when the screen is less than 600 pixels wide */
}

Advice appreciated

2

Hello there, can you try below code:

@media only screen and (max-width: 600px) {
#shopify-section-announcement-bar p.buttons {
display:none !important;
}
}

Also, can you share your store if it not works, for a customized answer.

3

That has worked!! Thank you soooo much !

4

Hi there, this has also hidden my announcment bar ?

5

Can you share your store details?

Edit: Also you can try this:

@media only screen and (max-width: 600px) {
body > div.announcement-bar__text.text-align-center > p.buttons {
display:none !important;
}
}
6

Sorry about this,. The button has been hidden but now my my message is partly hidden too look at att

Screen Shot 2021-03-11 at 09.27.46.png
Screen Shot 2021-03-11 at 09.27.46.png388×678 159 KB

7

Hi, thanks for this.. Have added but button visible in mobile

https://auchterlonies-com.myshopify.com/

pawd: awskob