Snipr Code Grid:
{"settings":{"resources":[],"title":"WPSnipr Visual Code Editor Example"},"code":{"html":"%3C!--%0AWrite%20your%20code%2C%20%0Athen%20click%20%3ERUN%20in%20the%20left%20top%20corner.%0A--%3E%0A%3Cdiv%20class%3D%22logo%22%3E%0A%20%20%3Cimg%20src%3D%22http%3A%2F%2Fwpsnipr.com%2Fwp-content%2Fplugins%2Fwpsnipr%2Fassets%2Fimg%2Fsnipr_logo.svg%22%20alt%3D%22wpsnipr%20logo%22%20%2F%3E%0A%3C%2Fdiv%3E","js":"%24(document).ready(function()%7B%0A%20%20%24('.logo').on('click'%2C%20function()%7B%0A%20%20%20%20alert('You%20clicked%20the%20wpsnipr%20logo')%3B%0A%20%20%7D)%0A%7D)%3B","css":"body%7B%0A%20%20background-color%3A%23c8d6dc%3B%0A%7D%0A.logo%20img%7B%0A%20%20position%3Aabsolute%3B%0A%20%20left%3A0%3B%20right%3A0%3B%0A%20%20top%3A0%3B%20bottom%3A0%3B%0A%20%20margin%3Aauto%3B%0A%20%20max-width%3A100%25%3B%0A%20%20max-height%3A100%25%3B%0A%20%20width%3A100px%3B%0A%20%20overflow%3Aauto%3B%0A%20%20cursor%3Apointer%3B%0A%7D"}}
<!--
Write your code, 
then click >RUN in the left top corner.
-->
<div class="logo">
  <img src="http://wpsnipr.com/wp-content/plugins/wpsnipr/assets/img/snipr_logo.svg" alt="wpsnipr logo" />
</div>
$(document).ready(function(){
  $('.logo').on('click', function(){
    alert('You clicked the wpsnipr logo');
  })
});
body{
  background-color:#c8d6dc;
}
.logo img{
  position:absolute;
  left:0; right:0;
  top:0; bottom:0;
  margin:auto;
  max-width:100%;
  max-height:100%;
  width:100px;
  overflow:auto;
  cursor:pointer;
}