When we first started this blog, I swore that I would post even the simplest of fixes I came across, and here is a fine chance — so I’m taking it!
While coding our new website layout, I ran into a problem that I had somehow always avoided before. Using the Phark Image Replacement method for creating simulated “alt” text for non-images (like a logo or header), I was unable to get the text in my element to disappear like normal.
Here’s the normal way of using image replacement:
a#logo { text-indent: -9999%;
background: url(images/some-image.png) no-repeat top left;
width: 100px; height: 50px; }
Finally, it dawned on me: I had a text-align: right also in this style that was messing it all up. So what’s the final takeaway from this post?
Negative text indents do not work when accompanied by a right text-align.
Alex 
HtmlPiggy 
Ollie Murphy 
Thanks so much for posting this. I didn’t have text-align: right explicitly set in my rule, but it was inheriting it, and your post was the clue I needed. Much appreciated!
Awsome finding! Thank you for this.
thank you for solution
can’t work with text-align:right – –
Thanks Allen for the solution. Seems like a few others ran into this issue as well!
Good tip. Bacon saved.
“Negative text indents do not work when accompanied by a right text-align.” – False Statement
It works but you need to set the text-indent atribute positive and set direction atribute to rtl. Hope it help =)
Very true! Thanks for the addition.
The statement is true as it states negative text indents and not positive.
It’s always the simplest thing isn’t it? Can’t believe I didn’t think of that. Thanks for the tip, you definitely saved me some time.
You do not need to specify the width or height.
You can use other scale: px, em…
For text-indent need the correct value text direction, simple add attribute dir=”ltr” for text-align:left or dir=”rtl” for text-align:right, in CSS3 – direction: ltr | rtl | inherit.
You will not need to remove the text outside the window.
Remove text outside the element, simple add overflow:hidden.
Sorry for my English.