insert content in center of box

Question

How do I insert "Milad" in the center of the box without using the margin properties?
https://code.sololearn.com/WfxJ29foL2b8/?ref=app

Answer 1

Use this

.box{
display: flex;
}
.box span{
margin: auto;
}

Answer 2

text-align: center; in the div.

then use in the span:
display: inline-block;
padding: 25px;

this uses no margin as your post requested

Answer 3

ahh ok..thanks for the clarification. it sounded like you didnt want to use margin at all..which margin auto with flex uses so I skipped that method

Answer 4

Another way to centering child element (the text) using flexbox

.box{
display: flex;
justify-content: center;
align-items: center
}

Answer 5

or you can use grid by nesting.

display:grid;

justify-self: center; align-self: center;

theres lots of ways and frameworks that make it easy..thats the beauty of web development you can decide how you want to do it

Answer 6

Jason Kennedy
Thanks, but its not center exactly.
I meant doing it directly and with a definite feature( like as text-align or center-crop), not with margin or padding and etc.

Answer 7

Calviղ & Jason Kennedy
None of your second suggestions worked.
But very thanks.