x
<html><head><style>.container { height: 200px; position: relative; border: 3px solid green; }.container p { margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}</style></head><body><h2>Center with position and transform</h2><p>Here, we use position and transform to vertically and horizontally center the p element inside the div:</p><div class="container"> <p>I am vertically and horizontally centered.</p></div></body></html>