I do want to add that instead of negative margins, if the size of the element is known, calc is a much better system.
calc
.center { position: absolute; height: 300px; width: 300px; top: calc(50% - 150px); left: calc(50% - 150px); }
Of course you can use an extra calc to make it a bit more generic if you're using variables for your height and width, but this method allows you to use margins on your element as well, which can be useful if you don't want it touching the edges.
Useful tip! Thanks for sharing!
Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment's permalink.
Hide child comments as well
Confirm
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
I do want to add that instead of negative margins, if the size of the element is known,
calcis a much better system.Of course you can use an extra calc to make it a bit more generic if you're using variables for your height and width, but this method allows you to use margins on your element as well, which can be useful if you don't want it touching the edges.
Useful tip! Thanks for sharing!