Reflect a letter horizontally using CSS

css, css-transforms

Solution

Set the `scaleX` property as a transform.

.logo:first-letter {
     transform: scaleX(-1);
 }

If it's always a specific letter, it might be a better idea to just use unicode for this. In your case, `CYRILLIC CAPITAL LETTER YA` (Я) will work.

Problem

I know how to reflect single letters vertically using `transform: rotate();` but not how to reflect them horizontally. Do you know how I can reflect them horizontally? I want to use it with the selector `.logo:first-letter {}` for my logo. ``` <a href="#" class="logo">RR</a> ``` EDIT: http://jsfiddle.net/n7YA7/1/ Cant use Я because I'm using a font from google which doesn't support it.

Original source