<div>
<p>I'm centered horizontally and vertically!</p>
</div>
div {
/* center all the things */
display: flex;
justify-content: center;
align-items: center;
/* giving the container height, width, and a border */
width: 100%;
height: 200px;
border: 2px gray dashed;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.