테이블에 대해 문의 드립니다.

<style>
/* 표의 속성 */
table {
border-collapse: collapse; text-align: center; width: 100%;
border: 1px solid #999;
}

/* 내용 셀 */
td { border-top: 1px solid #999;}

/* left로 지정한 셀만 좌측 정렬 */
.left {text-align: left; }

</style>
<table>
<tr>
<td>구분</td>
<td colspan=”2″>시간</td>
<td>내용</td>
</tr>
<tr>
<td>첫 번째<br>다음 문장</td>
<td>10:00 ~ 12:00</td>
<td>두 시간</td>
<td class=”left”>첫 번째 내용<br>
첫 번째 다음 줄</td>
</tr>
<tr>
<td>두 번째</td>
<td>13:00 ~ 16:00</td>
<td>세 시간</td>
<td class=”left”>두 번째 내용<br>
두 번째 다음 줄<br>
이 문장은 왼쪽에 정렬</td>
</tr>
</table>

위 소스를 test.html로 저장하고 IE로 보면 첫번째 내용, 첫번째 다음 줄, 두번째 내용, 두번째 다음줄, 이 문장은 왼쪽 정렬 부분이 테이블에서 좌측에 옵니다. 나머지는 가운데 오구요.
그런데 워드프레스로 위 내용을 페이지 추가해서 내용에 입력하면 모두 가운데 정렬로 나옵니다.
마지막 부분은 왼쪽에 나타내 보이려고 하는데 잘 안됩니다. 어떻게 수정해야 하나요?