A CodePen by Peter Peterson. Simple input incrementer/decrementer - Simple controls to increment or decrement an input field (no validation, formatting added, assuming you've entered in a valid number) Proof of concept, accessibility hasn't been addressed, javascript required.

index.html

<section class="qty">
  <label>Quantity</label>
  <input name="quantity" value="5">
  <div class="controls-wrapper">
    <a href="#" class="minus">-</a>
    <a href="#" class="plus">+</a>
  </div>
  
</section>

script.coffee

$ ()->
  $(".minus,.plus").click (e)->
    inc_dec = if $(this).hasClass("minus") then -1 else 1
    qty = $("[name=quantity]")
    qty.val(parseInt(qty.val()) + inc_dec)

style.less

body{ background: #d91; font-family: sans-serif; font-weight: 100; font-size: 10px; }
label{font-size:2em; color: #444;}

.qty{ width: 20%; margin: 0 auto; margin-top: 10%; display:block;}
[name=quantity]{
 background: transparent;
 border: 0;
  width: 2em;
  font-size: 2em;
  text-align: center;

}

.minus,.plus{ display: inline-block; font-size: 3em;
  text-decoration: none;
  background: #888;
  width: 2em;
  height: 1.5em;
  text-align: center;
  line-height: 1.3em;
  top: 1rem;
  position: relative;
  color:#aaa;
  box-shadow: 0 5px 0 #777;
  &:hover{
    color: #ffcd03;
    background: #aaa;
  }
  &:active{
    top: 1.5rem;
    box-shadow: none;
  }
}
.minus{  border-radius: 0.2em 0 0 0.2em; }
.plus{   border-radius: 0 0.2em 0.2em 0; }