Change border height

I’ve a div with after border with triangle shape, but I want to reduce the height of the triangle . jsfiddle

<div class="box">
    <div class="content"></div>
</div>

.box {
    width: 200px;
    height: 120px;
    position: relative;
    background-color: #88b7d5;
}
.box:after {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    border-color: rgba(136, 183, 213, 0);
    border-top-color: #88b7a1;
    border-width: 100px;
    margin-left: -100px;
}


Source: css3

Leave a Reply