Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
/* Center horizontally and vertically */ .centered { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } /* Center horizontally only */ .centered-x { position: absolute; left: 50%; transform: translateX(-50%); } /* Center using inset + margin: auto */ .centered-modern { position: absolute; inset: 0; margin: auto; width: fit-content; height: fit-content; }
Result
Open