Centering with margin: 0 auto; vs. justify-content and flexbox

Question

Doing some html horizontal center stuff, I just realized that I could use both things to center a box element into its parent, so my question is which of those 2 are better (in terms of performance, usability, etc).

Ironworker

How would one even compare the two by those metrics (performance and usability)? What do they even mean in this context? – Onus

with usability I wanted to ask what is the most common way you use to center an element into its parent. About performance I wanted to know if there were loading differences when the DOM was rendering the layout – Ironworker

Answer 1

If you use div or p it's better to use margin: 0px auto; for containers or main page, But if you need two or more children to be centered, it's better to set parent to text-align:center and the children to display: inline-block.

Dodgem

Answer 2

Because of the way margins are handled in flex, these do the same job.

But as a general practice, when you have more div's, using flex would do the job more accurately and will provide you choice for distributing the space equally". When you have few div' , you can go with margin:auto . Remember flexbox provides us the choice for redistributing the space.

Bellinger