0

For a design I'm making I need to use a character similar to the "greater than" sign (>), only less wide. Like this:

symbol

However, I'm having difficulties finding such a symbol. Would I have to use a .png image for this or can I use a real text character?

2 Answers 2

1

CSS

<style>
i {
border: solid black;
border-width: 0 1px 1px 0;
display: inline-block;
padding: 3px;
}

.right {
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}

.left {
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
}

.up {
transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
}

.down {
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
</style>

HTML

<p>Right arrow: <i class="right"></i></p>
<p>Left arrow: <i class="left"></i></p>
<p>Up arrow: <i class="up"></i></p>
<p>Down arrow: <i class="down"></i></p>

RESULT

enter image description here

1
  • Nice implementation, but it isn't ASCII.
    – Steve
    Commented Feb 14, 2019 at 22:20
1

Depends on where you will use it.

"›" - using keyboard: Alt+0155 or HTML: &rsaquo; More alternatives at https://codepoints.net/U+203A

1
  • its soooo tiny!
    – MarksCode
    Commented Feb 14, 2019 at 19:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.