Forum Moderators: not2easy

Message Too Old, No Replies

how to change spacing of text letters in <span>

I need them to look normally spaced, not spread.

         

Shadows Papa

8:43 pm on Nov 10, 2003 (gmt 0)

10+ Year Member



Please see example:

<span ID="celColorChange">v</span>
<span ID="celColorChange">a</span>
<span ID="celColorChange">r</span>
<span ID="celColorChange">i</span>
<span ID="celColorChange">e</span>
<span ID="celColorChange">g</span>
<span ID="celColorChange">a</span>
<span ID="celColorChange">t</span>
<span ID="celColorChange">e</span>
<span ID="celColorChange">d.</span>

I'm using a script to change the colors, they change as you watch. Problem is that instead of looking like:
variegated
they look like:
v a r i e g a t e d

Well, not that bad, about in-between normal and double-spaced.
How can I CSS that to bring them together?
I have this:
#celColorChange {
margin: 0px;
padding: 0px;
}
but that has no apparent effect.

Shadows Papa

DrDoc

8:56 pm on Nov 10, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Well, there's a space between each tag... That's why you get a space between the letters.

So, instead of doing:

<span ID="celColorChange">v</span>
<span ID="celColorChange">a</span>

...put all span tags on one line:

<span id="celColorChange">v</span><span id="celColorChange">a</span>

Shadows Papa

9:09 pm on Nov 10, 2003 (gmt 0)

10+ Year Member



Duh. Works great.
I guess that's the FP-XP mentality.
I put it in using FrontPageXP and it tends to "organize" things in outline format.
Works in most cases (but watch out for scripts!)
I removed all carriage returns (put it on one single line) and it works.
Now in NS where the script won't run, it's just a plain word, in IE where the script works, it's a rainbow effect.

Thanks.

DrDoc

9:11 pm on Nov 10, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Need help with the script?

Shadows Papa

9:25 pm on Nov 10, 2003 (gmt 0)

10+ Year Member



I've had a heck of a time - I finally got it working in IE by moving a line that "starts" the script. Before, the effect worked when the spans were before the script, but not after, so I moved the line that starts it.
I note the script won't work at all in NS 7.x, would be nice if it did.

Shadows Papa

DrDoc

9:29 pm on Nov 10, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Post a question in the JavaScript forum [webmasterworld.com] and we'll see what we can do ;)

killroy

9:41 pm on Nov 10, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Instead of puttign them in one line you could enclose them in another span and use CSS to modify the white space handling, such as nowrap or collapse.

SN

DrDoc

9:45 pm on Nov 10, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Another thing... You know you're not supposed to repeat an ID on a page? IDs are supposed to be unize on the page.

Shadows Papa

10:38 pm on Nov 10, 2003 (gmt 0)

10+ Year Member



Doc, yeah, but that's what makes the script work!
I know, it's a rule breaker, not sure how else to do it, however, someone good as SCRIPTS could probably rewrite it to work with different IDs.
I'll post over there for that part.

I did get my CSS file to validate. Only took one edit.

The only things on several pages keeping the HTML from validating was my lack of ALT for images (with several dozen on a page I'll be darned if i'm going in now and adding ALT to 60 or however many images per page on several pages.
Otherwise, it was the script that runs the floating menu and some other scripts that prevented validation on some pages.

Shadows Papa