The problem is that you are using a font library (like "Century Gothic") that does not have any macron'ed characters in its character set. When Mac goes to draw a macroned "ā", it sees that "Century Gothic" does not have one, so it draws "ā" in the browser's default font, (in your case probably Times or Georgia).

Here is a test file to prove this point: http://www.klixo.co.nz/support/fontcheck.html. 
You can see that the browser supported fonts correctly display the macron, while Century gothic does not (on a Mac).

Answer:

Don't use fonts that the browser does not support. The Klixo Story Editor offers a list of fonts that are supported by all browsers, so use one of those.