Jack
Jack

Reputation: 7547

Up and down arrow unicode font size issue

I have one of the most strangest problems that I have faced till today. I am trying to show up and down arrow in unicode in HTML. However, they are not same in size and color.

This is a small issue yet very irritating and stressful to me

<div>&#708;</div>
<div>&#8964;</div>

I will be really grateful if somebody could help me. I've already wasted 5 hours behind this.

Upvotes: 0

Views: 792

Answers (3)

vburrs21
vburrs21

Reputation: 3

They are not the matching pair.

&#708 matches with &#709. While &#8964 matches with &#8963.

Upvotes: 0

Tushar
Tushar

Reputation: 87203

You're not using the correct pair of arrows. Use &#709; entity for the corresponding down arrow.

See updated fiddle

<div>&#708;</div>
<div>&#709;</div>

If you're interested in filled arrows

Demo

<div>&#9650;</div>
<div>&#9660;</div>

Upvotes: 2

Adam Wolf
Adam Wolf

Reputation: 309

Well they are different. Its not a font size issue. http://graphemica.com/%CB%84 http://graphemica.com/%E2%8C%84

You should use bootstraps glyphicons http://jsfiddle.net/c9gp9a1w/

<span class="glyphicon glyphicon-chevron-up" aria-hidden="true"></span>
<span class="glyphicon glyphicon-chevron-down" aria-hidden="true"></span>

bootstrap http://getbootstrap.com/components/#glyphicons

Upvotes: 0

Related Questions