PDA

Click to See Complete Forum and Search --> : Getting SPAN's to center...

Zitchas
01-06-2006, 10:43 PM
Well, I'm trying to set up some spans, mostly in order to get a better grip on my code. Namely, I'm still learning, and I like to know when something's on the screen due to my putting it there, not just because what it's attached to put it there.

But anyway, the short of it is thus: When I put a TEXT-ALIGN:CENTER; into a heading (on my css sheet), it centers. Which is good. I put the exact same into a span class on the same sheet, it does... nothing. I've even run it through the validator on the w3c site, and it says everything's good and even lists it as a valid part of the code on my sheet.


H1 {
font-size : 28pt;
color : #000000;
text-align : center;
font-weight : 800;
line-height : 22px;
}
.TTL1 {
font-size : 28pt;
color : #000000;
text-align : center;
font-weight : 800;
line-height : 22px;
}


The H1 is, well, a heading. The .TTL1 is the class I'm using in a span. The section of the page these refer to is as follows:
(omited code above this point)

<BODY>
<H1>Test H1</H1>
<SPAN CLASS="TTL1">Test TTL1</SPAN>

(and omitted the rest of the code after this point, although to my knowledge none outside this should affect it. The header contains the import link to get the css, no other style code.)


Anyway, if anyone can help with this, it'd be much appreciated.

Thanks.

Z
NogDog
01-07-2006, 01:00 AM
Span is, by default, an in-line element. Therefore, text-align won't affect it. If you want the contents of the span to be a stand-alone block of text (centered or not), then it would make more sense to use an appropriate block-level element, such as <p>. If there is some semantic reason to use a <span> that you want to be treated as a block-level element, then add display: block; to the style for that element. But at least for your above example using a <p> would make more sense.
Zitchas
01-07-2006, 08:01 AM
Well, I did as sugested, and now it works.

Once again, thank you for the help. It seems I still have much to learn about using all these.

Thanks
NogDog
01-07-2006, 11:24 AM
This chart (http://www.w3.org/TR/CSS21/propidx.html) can be useful for a quick reference to see if a property has limited applicability.
ray326
01-07-2006, 05:03 PM
Since your content is senseless it's impossible to make a correct recommendation but that probably shouldn't be marked as a span at all. It probably should be a heading, paragraph or list item, all of which are block elements to which text-align:center can be applied.