Any way to move the icon to the left?

[TennoSerra]

Its working great! I just want to move the icon to the left.

I tried using ::before instead of ::after. I doesnt seem to work like that.
Other than that It could be done with using flexbox to move it around. But then I would have to make the icon an img tag
This breaks the changing icon when opened or closed.

This is an example of what im doing right now.(I replaced the + and - with Fontawesome Unicode Icons)
Im sorry if this question seems stupid.
Thanks for any help!

[michu2k]

Hi @TennoSerra
To move the icon to the left, you need to change position from right to left and add an additional spacing on the left side of the trigger. Here's a quick example of how you can do it:

HTML:

<button class="ac-trigger ac-trigger-left">....</button>

CSS:

  .ac .ac-trigger-left {
    padding: 10px 10px 10px 30px;
  }

  .ac .ac-trigger-left::after {
    content: "+"; /* FontAwesome icon */
    left: 10px;
    right: auto;
  }

  .ac.is-active > .ac-header .ac-trigger-left::after {
    content: "–";  /* FontAwesome icon */
  }

[TennoSerra]

It worked perfectly mate! Thank you very much for your help.
Your library is great and its really helping people like me who dont really know much JS.