Info box with down arrow

by freedawirl

HTML

<div class="infoBox">njaisndij
asnduindjud
sadmisoa</div>

CSS

.infoBox {

    text-align:left;

    font-size:14px;

    font-family:helvetica;

    color:#000000;

    width:152px;

    min-height:30px;

    position:relative;

    background:#ffffff;

    border:1px solid #dedede;

    padding:10px;

}

.infoBox:after, .infoBox:before {

    top:100%;

    left:50%;

    border:solid transparent;

    content:" ";

    height:0;

    width:0;

    position:absolute;

    pointer-events:none;

}

.infoBox:after {

    border-top-color:#ffffff;

    border-width:8px;

    margin-left:-8px;

}

.infoBox:before {

    border-top-color:#dedede;

    border-width:10px;

    margin-left:-10px;

}