SM article sample

by dreamdealer

HTML

<h2 data-messages="2">Johan van Tongeren</h2>
<h2 data-messages="7">Vitaly Friedman</h2>
<h2 data-messages="3">Keir Whitaker</h2>

CSS

body {
    padding: 50px;
    font-family: arial;
    background: #EEEEEE;
}
h2 {
    font-size: 20px;   
}
h2:after {     
    content: attr(data-messages);
    position: relative;
    display: inline-block;
    border-radius: 50%;
    background: #FF0000;
    border: 1px solid #FFFFFF;
    color: #FFFFFF;
    padding: 0px 3px;
    font-size: 11px;
    bottom: 10px; 
    left: -1px;
}