Center div on the middle of screen [duplicate]

What is the best pattern to align a semantic ui grid in the middle of the screen?

the css for this will ideal be this one.

.div{
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
    width: 100px;
    height: 100px;
}

But on semantic this dont look well with grids.

This is part of my html.

 <div class="ui grid container">
    <div class="ui center aligned three column grid">
      <div class="column">
      </div>
      <div class="column">
        </div>
      </div>
  </div>

Leave a Comment