A Pen by Luke.

index.html

<ul class='pdf-list'>
  <li><a href='#'>A PDF Title</a></li>
  <li><a href='#'>A PDF Title</a></li>
  <li><a href='#'>A PDF Title</a></li>
  <li><a href='#'>A PDF Title</a></li>
  <li><a href='#'>A PDF Title</a></li>
</ul>

PDF-List-with-images.markdown

PDF List with images

A Pen by Luke on CodePen.

License.

style.css

ul.pdf-list {
	list-style-type: none;
  font-family:verdana;
  margin:0;
  padding:0;
}
ul.pdf-list li {
background:url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NzIwRDM5RDcxMjdCMTFFMjg5NTg5NTdCNTU5RDM2OEIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NzIwRDM5RDgxMjdCMTFFMjg5NTg5NTdCNTU5RDM2OEIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo3MjBEMzlENTEyN0IxMUUyODk1ODk1N0I1NTlEMzY4QiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo3MjBEMzlENjEyN0IxMUUyODk1ODk1N0I1NTlEMzY4QiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PqjkKg4AAAWdSURBVHjaxFdLT11VFP7O494D98WjlNsQLwg14RHAhERi4qQaaSDGpNFqYtOY2IkjBk0cOnTgD2BqOrDRmGqUgjoosVEC4cZYCBQHBQwUolAIXOW+H+e41ubs4+nhXh52wEl2zuPuvfa3vrXWt9dVLMvCWV4qzvjS5cOtW7ecj5qm8bhSV1f3bSAQSJmmKb4riuLMkczJe7FYRD6fRzqdNvb29n7KZrPv0/wtXsv25Nrh4eHyAOgKyodSqZQig8HW1lbEYrFgoVBwAPCGbiDSOK1BIpHA7u4u1tbWLqdSqdubm5vXVFXdPhEDZPgPukXoXuJXGr6ZmRnE43FnQ+mtfPf5fBgcHBQg2NPq6mrU19cLEH19fa9PT09/tb6+/h79vnVsDhB9QRpVzISu6yHy2pCeM73JZFJQzJvzO3koBoMiL8V3v9+PUCgk2GBw/f39rzY2Nn5B7+d5XrmEdxigmMEwDAwNDWF/f194wcZqamo4rnj06BE6OzvBoJaWlrCysvJUOOSdbZw7dw4LCwsCWCQSeS2Xy92muYM2s5UBsEHyXiyUaKempkCJiN7eXuE5080AGZS8eHMJgEPR3t4u2GKGdnZ2eN0rZD9AdlMVQ8AAeAP2cHJyEmNjY8Jod3c3mpubsbq6KoBxXmxsbIh5ErQbhExUdiQcDiMajSIYDKKS3jgMyDiPj4+DEkd4MjExgYaGBuExA2hqahKby7J0V4e7SmRomK3a2loRFm8Zl6uC78hgYHl52aSFBUqo52m8nMlkREJ1dXUJkD09Pc5G/J09dRt2V4wE4g5pRQB0XefJMgfI27cpIb9uaWkRG3spVuzMzxJAd4n+byWURpg2FiCmjWPMDHBZuQEQQph/J1BK7MEXaxEhcZejtFWO8opJyEZ4AW/OSSM39QqQGPSc/uEO8vFfYGXTVFuHN2IwXtk+EgB73tbWJmpfJpl3oXhnUHQ3tzfhv9gOLVwLXVOf0nvv/UQMSM853jKB5HBTy5urRhW0hiiyD2dRovmqpjssVvK4khI6AEithGjQSSYGKyGLCS/icMg4i7tKmd3UjGT8PgoZlmNTzJHzeMh3XsPlzfbYbkUAcrJ7yFjKjQWt7Cn9pJ2PQk0moBEzpnmQvFxB5dTRa/PUDYm7/BiGRWBzayswuUom76FEIXGHzsvAM3VEbgOCflbAvzaQm/8VNZ9+hvT975H7fRZmJIKi7oNJ+WD5/LAUVeTLqXSgUuK4u5+S7kfy3l1oXX3Qu3pgXP0AiU8+gnH5LWikCZYIGRmOtcJ/oenYStBPwoCjA0R1fmMV+cVZBK5cR3L0DqxCEcbQOygsLSL1zefQXnwJWls7spRwNXUNoCbh2QBAHuKqjmImi9TdL6HE2mDV1MHfFIMWilALQ9pB6ZlbJ3ALD2Cl95FPFpD7cwuBzvCReaCfJP4lojX78Df88yAO7GwjPPwxxVqDoYvmlY9SlMwSjOgFGM9dEdrgo37BRwJl5gtHitKRADjpipRMqZ9/RJY8yz/ZRPjah0IMlXyOarEapi3ZQqxY/4sFaKQLKp2Uiqoc6p5PHwIyXHqyBSuTRuiNq6h+oR0+2kS1z3hvfZuOeionOiEdANx2SapYAWUDCvI0/Oa75Bm1Y9ThWNyE2D2AuwFxh00ebN4GxX1AHQIwMjIiu2MMDAygo6PD0X7BOXls2qDcRuVZ8VS1lGlKOFfYdkUAc3NzzkfqinDjxg1cunQJVVVVB4nm6Xi8uVLuFOTv3Fdwuz46Oor5+XncvHnz2BxQCalJjanBAKi9zpEhtqjY3kgEiiNOB4lo2UCt/6JhWdS2KY8fP86SvWqS60NdseKlzZZng/7lRKmnv0iLGKSPbdEcftbpWbXnKfZaNmLao8iD5hToO9dgnoBltre3F+lb2v7ndRjAWV3/CjAALo2mb0nJ/X8AAAAASUVORK5CYIIAAAA=
) left no-repeat;
	padding-left:36px;
	line-height:34px;
}