How To Change Marquee Announcement Bar Starting Point (Dawn Theme)

[MMast]

Thanks in advance!

I am looking to change the starting point of my marquee announcement to the very left that works for both mobile and pc. Example shown below.

Example:

[AnneLuo]

Hello, @MMast 

Can you share your store url?

[MMast]

https://decemberschild.com/

password: dc

[AnneLuo]

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code to the head tag

<style>
 .marquee__content{
   animation-direction: reverse;
 }
</style>

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

[MMast]

The code you provided didn't work

[AnneLuo]

Please change the code

<style>
 .marquee__content{
   animation-direction: reverse !important;
 }
</style>

[MMast]

That work's for the marquee going right, is there a way to make it go left instead?

[AnneLuo]

Do you mean the text is arranged from right to left?

[MMast]

In the image above I show where the text starts on my site, I would like the text to start in the box I drew going to the left.

[AnneLuo · Accepted solution]

Find the theme.liquid file and add the following code to the head tag

<style>
   .announcement-bar{
      justify-content: left !important;
   }
  .announcement-bar .marquee{
    padding: 0 2rem !important;
    margin: 0 !important;
  }
  .announcement-bar .enable-animation .marquee__content{
    padding: 0 !important;
  }
</style>

[MMast]

It is already

[MMast]

The code I'm using already has "left" at 0.