-1
<style>
  .maincont {
    width: 8em;
    height: 8em;
    background: purple;
  }

  body {
    background: limegreen;
    display: flex;
    flex-direction: column;
    place-content: center;
    place-items: center;
  }
</style>

<body>
  <div class="maincont"></div>
</body>

Why doesn't this code make the purple square centered in the page? The flex-direction property set to column should have placed it in the middle vertically right?

Temani Afif
  • 245,468
  • 26
  • 309
  • 415
Jade Sage
  • 11
  • 2

1 Answers1

-1

After I checked there is no problem with it, the purple box can be in center of the page, try clearing cache and cookies on the browser you are using then restart

Tamam45
  • 36
  • 4