Jump to content

Encountering problems while trying to avoid the font tag

Empy3

By Empy3
in HTML/XHTML

Recommended Posts

Empy3 Newbie

Empy3

Posted
Posted

Hiya, I'm new to these forums, so I'll toss a couple quick things out that might help:1. I'm self-taught as far as HTML goes. A couple months ago I was asked to create a website for my MMO guild (yes, I am a gamer ;x) and thought that it would be a good idea to create it in XHTML so that I learned how to do it right. Therefore, it's entirely possible that I missed something obvious, so if this ends up just being a stupid question, I apologize.2. I've looked for answers several other places, and I'm sure this is adressed somewhere several threads on these forums, but I couldn't find anything that fixed my specific problem.3. Opera is my main browser and I run on a 1024x768 screen size, but the page should display more or less correctly on any screen setting that is at least 1024x768. How the page loads in Opera is ideally what I'd like it to look like in any browser.4. The page is hosted on Angelfire at the moment, and for this I apologize profusely. I'm having trouble finding a web host that doesn't charge rediculous $ for the traffic my guild generally incurs, or require me to spend 200 hours a month making insightful posts on their forums. I work 2 jobs and run my fiancee's guild so that he has the time/$ to focus on school, consequently I'm short on both. (Btw, if anyone knows of some reasonable web host, input on that would also be <3'd. My google searches haven't turned up much helpful.)Basically, I'm having trouble finding a way to change text colors without using the font tag. My page is using transitional XHTML, so I know that I -can-, but I'd rather learn the right way to do it it without the font tags. I can't use the paragraph tag, because I need the text to change color without starting a new paragraph every time, and I also don't want to turn the affected text into headings. Additionally, the color change works in Opera and apparently Firefox, but not IE. Any help/input onto fixing this in IE would be greatly appreciated.>>Problematic Page<<Displays like this in Opera:Opera_DKP.jpgDisplays like this in IE:IE_DKP.jpgExternal Style Sheet:

body{background: #000000 url('/anime4/silver_angel/Onyx/Nightbane_Sidebar.jpg') no-repeat fixed center right;color: #a5a9ba;margin: 5%;font-family: sans-serif;font-size: small }p.green{color: #32cd32}.paladin{text-align: left;color: #da7093;font-weight: bold;}.warrior{text-align: left;color: #cd853f;font-weight: bold;}.hunter{text-align: left;color: #32cd32;font-weight: bold;}.shaman{text-align: left;color: #454aff;font-weight: bold;}.rogue{text-align: left;color: #ffd700;font-weight: bold;}.druid{text-align: left;color: #ffa500;font-weight: bold;}.priest{text-align: left;color: #fffafa;font-weight: bold;}.mage{text-align: left;color: #00bfff;font-weight: bold;}.warlock{text-align: left;color: #8b008b;font-weight: bold;}

Actual HTML (Shortened to a few examples since the whole page is basically repetitions of the same thing):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"><head><title>Onyx DKP (l 0 0 t   p 0 i n t z)</title><link rel="stylesheet" type="text/css"href="/anime4/silver_angel/Onyx/DKP.css" /></head><table width="50%"><tr><td><text class="priest">Anabella</text>/<text class="warlock">Moranna</text></td><td align="right">43</td><td align="left">[25]</td></tr><tr><td><text class="rogue">Armadyl</text>/<text class="hunter">Kirsdarke</text></td><td align="right">110</td><td align="left">[90]</td></tr><tr><td><text class="rogue">Emerik</text>/<text class="hunter">Monoch</text></td><td align="right">47</td><td align="left">[47]</td></tr><tr><td><b>*</b><text class="warrior">Kiaiokalewa</text>/<text class="druid">Tem</text></td><td align="right">48</td><td align="left">[292]</td></tr><tr><td><text class="warrior">Shded</text>/<text class="paladin">Deathknights</text></td><td align="right">71</td><td align="left">[5]</td></tr><tr><td><text class="hunter">Zindak</text></td><td align="right">92</td><td align="left">[20]</td></tr><tr><td colspan="3" align="left"><p class="green">Last updated: 9-15-07 (Grull 9-9, Kara 9-10[K], Kara 9-10[M], Kara 9-14[K], Kara 9-14[M]) 9-9-07 (Kara 8-31[K], Gruul 9-1, Kazzak 9-1, Kara 9-1, SSC 9-2, Kara 9-6, Kara 9-7, SSC 9-8) 9-1-07 (Grull 8-25, Viscidous 8-26, Kara 8-27[K], Kara 8-27[M], Kara 8-30, Kara 8-31[M]) 8-25-07 (Kara 8-10, Kara 8-13, Kara 8-15, Kara 8-16, Kara 8-18, Gruul 8-18, SSC 8-19, Kara 8-20, Kara 8-25[K], Kara 8-25[M]) 8-18-07 (Grull 8-11, Gruul 8-12) 8-11-07 (Mag 8-5, Kara 8-6, Kara 8-8) 8-5-07 (Gruul 8-4) 8-4-07 (Gruul 7-28, Kara 7-29, Kara 7-30, Kara 8-1, Kara 8-2, Kara 8-3) 7-28-07 (Gruul 7-21, Kara 7-22, Kara 7-23, Kara 7-25, Kara 7-27) 7-22-07 (Kara 7-15, Kara 7-16, Kara 7-19, Kara 7-20) 7-15-07 (Kara 7-13, Gruul 7-14) 7-12-07 (Kara 7-11) 7-10-07 (Kara 6-23, Gruul 6-30, Kara 7-1, Kara 7-2, Kara 7-4, Kara 7-6, Gruul 7-7, Kara 7-8, Kara 7-9) *2 Missing raid logs from 6-22 and 6-25*. 6-22-07 (Kara 5-26, Kara 5-28, Kara 6-2, Kara 6-4, Kara 6-8, Kara 6-9, Kara 6-11, Kara 6-15, Kara 6-16, Kara 6-18)</p></td></tr></table></body></html>

Any help that could be offered as to why the colors work the way I want them to in Opera and not in IE would be greatly appreciated. Also, is the difference in text sizes something that is innate to the different browsers, or also a problem with the way IE reads the code? Again, I apologize profusely for fact that the page is hosted on Angelfire. :)Edit: I fixed the inconsistent font size by using a 12px instead of small.

Link to comment
Share on other sites
ste Member

ste

Posted
Posted

you should use the span tag. it is simply a container that displays inline by default (i.e. it dosent seperate content onto a new lines like say a paragraph or a div which has by default the following style display:block)example (x)html:<p> john went to the <span ="red">shop</span> to buy <span class="blue">clothes.</span> </p> css:.red {color: red;}.blue {color: blue;}

Link to comment
Share on other sites
Empy3 Newbie

Empy3

Posted
  • Author
Posted
you should use the span tag. it is simply a container that displays inline by default (i.e. it dosent seperate content onto a new lines like say a paragraph or a div which has by default the following style display:block)example (x)html:<p> john went to the <span ="red">shop</span> to buy <span class="blue">clothes.</span> </p> css:.red {color: red;}.blue {color: blue;}
Oh, thank you so much. ^^ That completely fixed it. I wonder how I've never run across the span tags before. O_o
Link to comment
Share on other sites
SySRoot74 Newbie

SySRoot74

Posted
Posted
And I have never seen <text></text> tags before???
She most likely confused them with <font>. Since the tag doesn't exist, that's why IE didn't recognize it, where as Opera accepted it sense it's a bit more flexible.Also, for webhosts, a few I know of:http://www.zone.net (My current VPS host, average prices, great support and reliability)http://host.gotcanyons.net/ (Somewhat cheap, reliable)http://www.dedicatedbox.net (Dedicated server boxes as low as $55; nothing but great reviews from this guy, I'll be ordering a box in the next month or so)http://montecarlohosting.net/ (Same is said as above, though he can be a bit pricey; but as all his users have said, the connection they've made with him/his staff, the quality of support and reliability pays off the difference).http://www.charlottezweb.com/ (Cheap, reliable, probably a bit closer in your price-range; same goes for GotCanyons).Hope this helped :)
Link to comment
Share on other sites
Shonumi Member

Shonumi

Posted
Posted

Empy3 has since modified the page on the site, I can't find those tags anywhere on the updated site page. The reason it may have not presented a problem is that some weird quirks mode went into activation? I tried to replicate this effect yet no availing was underwent; I don't know how your page was even working with the first code provided. But those screenshots seem to prove the otherwise. Strange...

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...