CSS - Simple flexbox example

by katalin_2003

HTML

<div class="centered">
  Centeredville
</div>
<div class="centered centered2">
  Centeredville
</div>

CSS

html,
body {
  height: 100%;
  margin: 0em;
}


.centered {
  height: 50%;
  font-family: sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 4rem;
  background-color: violet;
}

.centered2 {
  background-color: darkviolet;
}