JSFiddle - React, Tailwind, and code Playground

HTML

<h1>
Box-sizing
</h1>
<img id="fixed" src='https://s-media-cache-ak0.pinimg.com/originals/14/c3/8c/14c38ce05dc93cc7b5d82a9b8f04db08.jpg'>
<h1>
Non box-sizing
</h1>
<img src='https://s-media-cache-ak0.pinimg.com/originals/14/c3/8c/14c38ce05dc93cc7b5d82a9b8f04db08.jpg'>

CSS

#fixed {
  /*This makes all padding, borders, etc INSIDE the box, 
  instead of adding to its outside content
  https://developer.mozilla.org/en/docs/Web/CSS/box-sizing?v=control*/
  box-sizing: border-box;
}

img {
  max-width: 50%;
}

img:hover {
  border: 5px solid red;
}