Change font size only in mobile view in announcement bar

Store Design
1

Hey,

I just want to change the announcement bar font size only in mobile view. Below is the image of the text.https://0bc922.myshopify.com/

Store link:

randomchikibum_0-1687810578383.png
randomchikibum_0-1687810578383.png571×226 11.2 KB

1 Like
2

Hi @randomchikibum ,

You can just add the media query the code that I give you before on the other post. Like this.

@media only screen and (max-width: 750px){
#shopify-section-sections--19406554792258__announcement-bar p.announcement-bar__message.h5 {
    font-size: 25px;
}
}

Result:

Ribe_Dagandara_0-1687811254852.png
Ribe_Dagandara_0-1687811254852.png497×495 34.5 KB

I hope it help.

3

not working

4

Hi @randomchikibum

I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the base.css file:
@media screen and (max-width: 550px) {

#shopify-section-sections–19406554792258__announcement-bar p.announcement-bar__message.h5 {font-size: 10px;}
}

Regards,

San

5

Hi @randomchikibum .

Follow These steps,

Go to the online store theme and go to base.css file paste the code mentiond below.

@media only screen and (max-width: 550px){
#shopify-section-sections--19406554792258__announcement-bar p.announcement-bar__message.h5 {
    font-size: 12px !important;
}

}

websensepro_0-1687874902149.png
websensepro_0-1687874902149.png544×426 24.9 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!