border (frame) overlay and inset on image

_imageOutlineComp.css

div.ie-container {
  display: inline-block;
  position: relative;
}

div.ie-container:before {
  display: block;
  content: '';
  position: absolute;
  top: 4px;
  right: 4px;
  bottom: 4px;
  left: 4px;
  border: 1px solid white;
}

img {
  vertical-align: middle; /* optional */
}

_imageOutlineStd.css

// border(frame) overlay image
// not compatiable under IE10

img {
  outline: 1px solid white;
  outline-offset: -4px;
}

demo.html

<div id="std">
  <img src="//lorempixel.com/200/200" />
</div>
 
<div id="comp">
  <div class="ie-container"><img src="//lorempixel.com/200/200" /></div>
</div>