Mobile Announcement Bar Text Not Centered in Dawn Theme

[AndreaH3737]

No matter what code I try to input from searching previous people who've had the same issue, I cannot get this announcement bar text to center on the mobile view.  Any help is appreciated.

https://np09cy3x2pk6tcl4-89214681390.shopifypreview.com

[ZestardTech · Accepted solution]

Hello @AndreaH3737 

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

.announcement-bar__message {
text-align: center !important;
}

[AndreaH3737]

Thank you!

[ZestardTech]

Hello @AndreaH3737 

Thank you for your response. It's good to know that it's worked for you. Kindly feel free to get back to me if you need any further assistance.
If helpful then please Like and Accept Solution.

[zack_dev]

hi apply this css 

p.announcement-bar__message.h5 {
    text-align: center;
}

p.announcement-bar__message.h5 span {
    display: inline-block;
    text-align: center;
}

[namphan]

Hi @AndreaH3737,

Please go to Actions > Edit code > Assets > base.css file and paste this at the bottom of the file:

#shopify-section-sections--23617540784430__announcement-bar .announcement-bar__message {
    text-align: center !important;
}

[DaisyVo]

Hi @AndreaH3737 

To complete your requests, please follow these steps:

1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
2. Paste the code provided into the Custom CSS section.

@meida screen and (max-width: 768px){
#shopify-section-sections--23617540784430__announcement-bar p.announcement-bar__message {
    text-align: center !important;
}
}

Here is the result: https://prnt.sc/bXrQq8kgMq3t

I hope this helps

Best,

Daisy