<div class="container">
<div class="item">centered</div>
</div>
/* center with flexbox */
html,
body,
.container{
height: 100%;
}
.container{
display: flex;
justify-content: center;
align-items: center;
}
.item {
border: 1px solid black;
}
This Pen doesn't use any external CSS resources.