CodePen

HTML

            
              <div class="contentlast">
	<div class="conlastbase">
		All Posts
        <ul class="conlast">
            <li>Name<br /><div class="sub">Subject</div><div class="date">2<sup>nd</sup> May 2013</div></li>
            <li>Name<br /><div class="sub">Subject</div><div class="date">2<sup>nd</sup> May 2013</div></li>
            <li>Name<br /><div class="sub">Subject</div><div class="date">2<sup>nd</sup> May 2013</div></li>
            <li>Name<br /><div class="sub">Subject</div><div class="date">2<sup>nd</sup> May 2013</div></li>
            <li>Name<br /><div class="sub">Subject</div><div class="date">2<sup>nd</sup> May 2013</div></li>
            <li>Name<br /><div class="sub">Subject</div><div class="date">2<sup>nd</sup> May 2013</div></li>
            <li>Name<br /><div class="sub">Subject</div><div class="date">2<sup>nd</sup> May 2013</div></li>
        </ul>
    </div><!--Conlastbase-->
</div><!--Contentlast-->
            
          
!
via HTML Inspector

CSS

            
              
@media only screen and (max-width: 481px) {
.contentlast{
	width:100%;
	margin-top:10px;
	margin-left:0px;
}
}
@media only screen and (max-width: 769px) {
.contentlast{
	width:100%;
	margin-top:10px;
	margin-left:0px;
}
}
.conlastbase{
	padding:inherit;
	list-style:none;
}
.conlast li{
	background: url(../images/defaultPhoto.jpg) no-repeat, url(../images/arrow.png) no-repeat, #EEEEEE;
	background-size:contain;
	background-position:0px,42px;
	padding-left:60px !important;
	opacity:1;
	display:block;

	margin-top:1px;
	margin-left:-40px;
	font-size:14pt;
	font-family:Calibri;
	color:#000;
}
.conlast li:hover{
	background-color:#999;
}
.sub{
	font-size:12pt;
	font-weight:lighter;
}
.date{
	float:right;
	font-size:11pt;
	font-weight:normal;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................