Full screen div with Centered Div Inside

by greatCar

HTML

<div class="left">
  
  <div class="centerItem" >

  </div>
  
</div>

CSS

html, body {
  height: 100%;
}
body {
  display: flex;
}

.centerItem{
  background: red;
  height: 100px;
 width: 100px;
}

.left {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center; 

}

.left {
  background: lightblue;
}

.right {
  background: cyan;
}