Question

I have a text area and three buttons that changes the text-align of the text to left, center and right:

<button onClick="align('left')">Left</button>
<button onClick="align('center')">Center</button>
<button onClick="align('right')">Right</button>

function align(alignment)
{
    document.getElementById("textArea").style.textAlign = alignment;
}

This works perfectly in Firefox and Chrome, but in IE9 it doesn’t work. At first it looks like it just hasn’t aligned it, but when I then go to type some more text, it then aligns everything correctly.

Is there anyway to make it align when you press the button?

Many thanks!

Answer 1

Hacky but works:

function align(alignment)
{
    ta = document.getElementById("textArea");
    ta.style.textAlign = alignment;
    ta.value= ta.value;
}