Create arrow-buttons in a from-stepA-to-stepB-style. White with gray borders. Doesn't work in Chrome with the vertical alignment dislocating the ::before and ::after-things. Can use a lot of improvements overall.

arrowbuttons.css

/*
 html:
 <div class="button arrow active">
  <span>Title</span>
 </div>
*/
.button:focus {
    outline: none;
}
.button.arrow.active {
    color: black;
}
.button.arrow {
    background-color: white;
    border: 3px solid #ccc;
    padding: 0 4px 0 28px;
    position: relative;
    margin: 0 2em .5em 0;
    box-sizing: border-box;
    font-weight: bold;
    cursor: pointer;
    color: #999;
    max-height: 46px;
    min-height: 46px;
    height: 46px;
    text-align: center;
    display: table;
    float: left;
    max-width: 100px;
}
    .button.arrow::before {
        content: "";
        position: absolute;
        top: 0px;
        right: -46px;
        width: 0;
        height: 0;
        border: 23px solid transparent;
        border-left: 23px solid #ccc;
    }
    .button.arrow::after {
        content: "";
        position: absolute;
        top: 3px;
        right: -37px;
        width: 0;
        height: 0;
        border: 20px solid transparent;
        border-left: 20px solid #fff;
    }
    .button.arrow span {
        padding: 0;
        margin: 0;
        display: table-cell; 
        vertical-align: middle;
    }
        .button.arrow span::before {
            content: "";
            position: absolute;
            top: 1px;
            left: 3px;
            width: 0;
            height: 0;
            border: 22px solid transparent;
            border-left: 22px solid #ccc;
        }
        .button.arrow span::after {
            content: "";
            position: absolute;
            top: 3px;
            left: 0px;
            width: 0;
            height: 0;
            border: 20px solid transparent;
            border-left: 20px solid #fff;
        }
    .button.arrow.active { 
        border-color: #555;
    }
    .button.arrow.active::before,
    .button.arrow.active span::before { 
        border-left-color: #555;
    }