title: Background-size and background-position on an img tag
body: <p>I have an image that can be cropped used a JS lib. The lib returns x,y, width and height of the selection. </p>
  
  <p>Initially, the logic was just several uploaded image (in <code>&lt;img&gt;</code>) sit side by side with little edit buttons over them that open a pop-up with the cropping logic. However, now the specification is to have the preview of what was cropped. </p>
  
  <p>The question - is there a way to do it without switching all <code>&lt;img&gt;</code> to <code>&lt;div&gt;</code>s that will have all images as background and can be moved and scaled to show the cropped part? Is there a counterpart to such styling or another possible workaround in which I can keep the <code>&lt;img&gt;</code> tags? </p>