CodePen

HTML

            
              <div class="mainContent">
			
				<!--		start of articles		-->
				<article>
									
					<div class="post-wrap">
						<header>
										
							<h1><a href="">This is Photoshop's version  of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. 
							</a></h1>
							
						</header>
					
						<a class ="previewImg" href="#">
								<img src="http://lorempixel.com/90/90" alt="Post picture" />
						</a>
						
						<p>
							This is Photoshop's version  of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet ...
						</p>
						<a class="more" href="">Read More</a>
					
					</div>					
				</article>
</div>
            
          
!
via HTML Inspector

CSS

            
              .mainContent {
	width: 45em;
}
article {
  padding:90px;
  border: 1px solid black;
}  

h1 a {
	font-size: 36px;
	line-height: 45px;
	text-decoration: none;
	color: #292929;
	margin-bottom: 0.75em;
}

a:hover {
    color: #c77838;	

}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

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