Forum Moderators: not2easy
here's an example of the existing format...
<font color="#a020f0">Widget</font> <font color="#228b22">World</font> <font color="#ff0000">U</font><font color="ffffff">S</font><font color="#0000ff">A</font> for some reason i'm thinking that it should be easier with css... easier as in wrapping it in one class... however, there are times when this is needed to be done in the middle of anchors, paragraphs and titles...
i know i'm missing something but can't see the forest for all the trees ;(
eg.
span.multicolour span:first-child {
color: red;
}
span.multicolour span + span {
color: blue;
}
span.multicolour span + span + span {
color: green;
}
then just
<span class="multicolour"><span>red</span> <span>blue</span> <span>green</span></span>
Works in my Mozilla, but I wouldn't like to bet on IE :)
this particular phrase appears in H1's, H2's, H3's, paragraph text, and link anchors... it's become logo-esque and appears the same everywhere it is seen (on the site)...
that's an interesting way of doing it... are there also second-child and third-child options? i do use first-letter in one of my classes... is there also second-letter and third-letter? i could see something like this being very nice to work with...
span.multicolour:first-child {
color: #a020f0;
}
span.multicolour:second-child {
color: #228b22;
}
span.multicolour:third-child:first-letter {
color: red;
}
span.multicolour:third-child:second-letter {
color: white;
}
span.multicolour:third-child:third-letter {
color: blue;
}
then i could easily use
<span class="multicolour">widget world 123</span> and feel a lot more comfortable and safer doing it...
too bad we can't group and subgroup css styles within the parens but have to explicitly specify each of them...
[edit] correct use in sample /[edit]
[edited by: wkitty42 at 5:52 pm (utc) on Sep. 12, 2003]
1. Simplicity, if you have 1 image and you make it large, with web resolution/color then it can be used at various scaled sizes(photoshop is a good tool for this).
2. Logo preservation(I think that's what the business people would classify this under). Basically you don't want to have your logo showing up in 100 different shapes and sizes. Take McDonalds for example. Look for the big 'M' anywhere, you will find that where ever you find it, the dimensions with be proportional to every other one you find. The word Mc Donalds will appear in the exact same location of every logo.
Now this may be stepping past the bounaries of a simple web site for a company, but because of the first reason, I would try to figure out a way to use images.
If this cannot be the case, then using classes built with descriptive names to what is inside them is what I would do
.red { color:red }
You get the idea.
AND bravo on not using the font tag. HTML4 standards do get used... :)
i know and understand what you are saying... however, an image won't wordwrap and its too very hard to get images and text to verticle align properly all the time... not to mention the various sizes needed all over the place and then there is the spacing between the image and the rest of the words as well as character spacing... should i also mention the various fonts... the phrase and coloring is the key... not necessarially the font used... and its not a logo per se'... not like a /graphical/ logo...
also with images, you have to worry about stairsteps at larger sizes as well as antialiasing and different backgrounds and such...
sure, i could use three images to handle the wordwrap concern but then i triplicate the above...
its just too much for such a simple thing that i've been using and doing for many years, now...
your example does work in moz and not in ie... too bad its as convoluted as the original font stuff... i'm at a loss, now, as to which way to go... keep the font stuff and fly the doctype as transitional or what... the added subtraction to all this is that is doesn't work across all browsers :( the font thing works perfectly in all browsers... too bad its been/being depricated :(:(
I understand your concern with the image thing.
so go with what my other suggestion is
.red { color:red;}
.blue{ color:blue;}
....
...
Then your html can just be <strong class=red>changed</strong> <strong class=blue>like</strong> that.
I use strong just cause, if I'm changing the color, I usually want it to stand out, so I bold...errr *strengthen* it's look. HAHA, that sounds so stupid.... anyway
That works fine, but were you looking for a way that didn't include all those tags?
<strong> is 4.01 if I recall correctly, and if the browser doesn't support CSS, then it won't change the way it shows up, just the color. I thought that's what CSS was for. You can control what it looks like, but if the browser doesn't support that specifically, it will still show up, without all the bells and whistles.
yes, in a way, i'm looking for a way that is much better and easier to implement... having been a coder in several languages for some 20+ years, i know that i can get hardnosed and set the attribute i want on each and everything but that costs a lot in time (downloading and rendering) and size not to mention that its cumbersome and i always have to copy'n'paste a known good codeblock to ensure that i get it right every time...
no, they don't work across all browsers... IE doesn't do anything with the first css example given... with the wish example i posted, it does set everything to the first specified color...
font and image are the only two that work across all browsers... we have already laid out the problems with using image and it doesn't work in textonly browsers ;)
<sigh> oh well... someone's always gotta be breaking something :( might as well be the w3c and their standards and such...
No offense to HTML users or anything, but I don't consider HTML "coding". It's just tags(this is for another thread/forum all together though HAHA).
Once you have this done the first time(hardnosed) it is only good practice to copy/paste this anyway. That's exactly what I would do. Why retype...
Anyway, good luck with it.
Oh I forgot, if you do it hardnosed(and using CSS), and the browser doesn't support it, then you will at least know it will show up, and not in the wrong color, just no color