The gremlins struck again.
I added a simple span to the style sheet for a few lines of text to center and display double size.
#span-3 { font-size: 2em; text-align: center;}
The text inside the span range happily changes size, but stays on the left. I checked 4 different sources that confirm this is how you do it, but Chrome, Firefox and Opera all keep it left aligned. I experimented with swapping "center for ârightâ and retyped it 3 times; the size changes with the value altered, but not the position. :mad:
What have I done wrong this time?
I donât have these problems with brain surgery.
[font=verdana]What you have to remember is that <span> is an inline element, so it shrink-wraps around its text or contents, and is always precisely the width needed for the text. What youâve said is that you want the text to be centered within the <span>, but as the <span> is precisely the same width as the text, it will look exactly the same whatever alignment you choose, because thereâs no room for it to move.
You have a couple options, depending on what fits best with the rest of the code/layout:
[list][]change the <span> to a <div>
[]make the <span> behave like a <div> with {display:block;}[/list]
If you were wanting the text on the right, you could also apply float:right; to it, but thereâs no way to float anything to the middle.[/font]
In order to apply text-align: the element must be able to have explicit width:. Only block-type elements have can have explicit width:.
In addition to what Steve D said: you could also set the element to display:inline-block; and width:(some width;) then thetext will center withing that elementâs width.
