JSFiddle - React, Tailwind, and code Playground

by alekskorovin

HTML

<ul class="widget-list">
    <li>
        <span class="wl-news"><a href="#link">Some interesting news</a></span>
        <span class="wl-date">25.07.2012</span>
    </li>
    <li>
        <span class="wl-news"><a href="#link">Some other interesting news</a></span>
        <span class="wl-date">24.07.2012</span>
    </li>
    <li>
        <span class="wl-news"><a href="#link">Upcoming events</a></span>
        <span class="wl-date">23.07.2012</span>
    </li>
</ul>

CSS

.widget-list {
    font: 1.0em normal Arial, Helvetica, sans-serif;     
}
.widget-list li:first-child {
    border: 0;   
}
.widget-list li {
    border-top: solid 1px #ccc;
    padding: 5px;
}
.widget-list li:before {
    content: '◈';   
}
.wl-date { 
    font-size: 0.7em;   
}
.widget-list a {
    color: #00c;
    text-decoration: none;    
}
.widget-list a:hover {
    color: #000;   
}