http://stackoverflow.com/questions/38820710/img-max-width-how-does-it-work

img max-width how does it work?

HTML

<h1>
 USING PERCENTAGE
</h1>


<img src="https://lh4.googleusercontent.com/-IhVc_Wxy6dY/AAAAAAAAAAI/AAAAAAAAFUw/YGRzJd5jolg/photo.jpg" class="boxer" style="max-width: 133% !important;">

<br/><br/>

<h1>
 USING PIXEL
</h1>

<div class="box">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Suscipit obcaecati, ad aliquid a dolor laborum nostrum odit, maiores deleniti pariatur libero, qui, corrupti similique eaque repellat sapiente incidunt quos culpa.
</p>
</div>

<br/>
<img src="https://lh4.googleusercontent.com/-IhVc_Wxy6dY/AAAAAAAAAAI/AAAAAAAAFUw/YGRzJd5jolg/photo.jpg" class="box">

CSS

.1box{
  border:1px solid red;
  max-width:500px;
  width:1000px; /* See max-width is priority*/
}

.boxer{
  border:1px solid purple;
  m1ax-width:33%;
  1width:500px;
}