Arrow

up down arrows

by Muthuraman B

HTML

<div class="arrow arrow-up">

</div>
<div class="arrow arrow-down">

</div>
<div class="arrow arrow-right">

</div>
<div class="arrow arrow-left">

</div>

CSS

.arrow {
  float:left;
  width: 15px;
  height: 15px;
  border: 2px solid #32557f;
}

.arrow-up {
  border-right: 0;
  border-bottom: 0;
  transform: rotate(45deg); 
}
.arrow-down {
  border-left: 0;
  border-top: 0;
  transform: rotate(45deg);
}
.arrow-right {
  border-right: 0;
  border-top: 0;
  transform: rotate(45deg);
}
.arrow-left {
  border-left: 0;
  border-bottom: 0;
  transform: rotate(45deg);
}