Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flip an arrow character

Tags:

html

css

ascii

Hello I found this arrow that I like ➣ ➣, I am trying to get the opposite direction for this arrow but cannot seem to find one. I noticed that when I found it on this page: http://character-code.com/arrows-html-codes.php there was an additional code listed (➣), but this just makes the same right-arrow when I need a left one.

Does a left arrow for this not exist?

like image 626
Austin Avatar asked Jan 16 '15 19:01

Austin


2 Answers

<span>&#10147;</span>

span {
  transform: rotate(180deg);
  display: inline-block;
}

This doesn't provide an opposite unicode arrow. It rotates the original arrow 180 degrees.

Even better is to flip the arrow horizontally. This CSS should do that.

transform: scale(-1);
filter: flipH;
-ms-filter: flipH;

span.rotate {
  transform: rotate(180deg);
  display: inline-block;
}

div.flipped {
  display: inline-block;
  -moz-transform: scale(-1, 1);
  -webkit-transform: scale(-1, 1);
  -o-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
<div>Rotated
  <span class="rotate">&#10147;</span>
</div>

<div>Flipped
  <div class="flipped">&#10147;</div>
</div>
like image 151
Mouser Avatar answered Sep 21 '22 01:09

Mouser


There is no opposite-direction character corresponding to U+27A3 THREE-D BOTTOM-LIGHTED RIGHTWARDS ARROWHEAD. A sufficient proof is that if you search a Unicode character data base, e.g. using BabelMap, for characters with names containing THREE-D, you find only U+27A3 and U+27A2 THREE-D TOP-LIGHTED RIGHTWARDS ARROWHEAD. If there were a corresponding leftwards character, it would be practically certain that its name is similar, just with RIGHTWARDS replaced by LEFTWARDS.

@Mouser has suggested nice workarounds, but I thought the question as asked deserves to be answered, too.

like image 25
Jukka K. Korpela Avatar answered Sep 20 '22 01:09

Jukka K. Korpela