Text-align: center;

[bgb]

Hello all,

<div>
<span> Text </span>
</div>

If i;

div {
text-align: center;
}

browser centers my span element inside that div.

But when i try to apply;

span {
text-align: center;
}

It doesn’t work. I want to know why.

[jwilkins.oboe]

HI @bgb !

I would suggest modifying your code by adding a black border so you can see the differences.

div {
  text-align: center;
  border: 5px solid black;
}

divs are block level elements that take up the full horizontal width as you can see in this screenshot.

But spans are inline elements and will take up as much width as necessary for that tag as you can see here

It looks like you wanted the text to be horizontally centered so I would suggest using a paragraph element which is also block level.

<p> Text </p>

p {
  text-align: center;
  border: 5px solid black;
}

[bgb]

Hello @jwilkins.oboe ,

I was thinking the same thing but i wanted to be sure if my opinion was true or not.
Thank you.