text-align:rightが効いているとtext-indent:-9999pxでテキストを非表示にできない

by iwbjp

HTML

<p>text-align: rightが効いていると消えない</p>
<div id="a">hoge</div>
<p>text-align: leftを指定すると消える</p>
<div id="b">hoge</div>

CSS

body {
    text-align: right;
}

#a, #b {
    width: 100px;
    border: 1px solid #000;
    text-indent: -9999px;
}

#b {
    text-align: left;
}
}