<h1>Flex + Image align</h1> 
<div class="box"> 
 <img class="imgcenter" src="http://p3.pstatp.com/origin/2ee200021b01de8df129"> 
</div>
h1{ 
  text-align: center; 
} 
.box{ 
  width: 800px; 
  height: 600px; 
  border: 1px solid #f00; 
  margin: auto; 
 display: flex; 
  justify-content: center; 
  align-items: center; 
} 
.imgcenter{ 
 max-width:100%; 
 max-height:100%; 
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.