A Pen by Hans Spieß.

index.html

  <p class="thumbnail-container">
    <img src="http://www.hansspiess.de/wp-content/uploads/2013/10/monitor-content.png" alt= "screenshot">
  </p>

Presenting Screenshots with Monitor Style via Css.markdown

Presenting Screenshots with Monitor Style via Css 2

A Pen by Hans Spieß on CodePen.

License.

style.css

 
.thumbnail-container {
  background-image: url(http://www.hansspiess.de/wp-content/themes/reverie/images/monitor-thumb.png);
  background-repeat: no-repeat;
  height: 192px;
}
  .thumbnail-container:after {
    position: absolute;
    content: "";
    display: block;
    width: 117px;
    height: 142px;
    background-image: url(http://www.hansspiess.de/wp-content/themes/reverie/images/monitor-thumb-flare-2.png);
    background-repeat: no-repeat;
    z-index: 100;
    margin-top: -137px;
    margin-left: 126px;
  }
 
  .thumbnail-container img {
    margin: 10px;
  }