Black background?

[J1A3L5]

Hi,
Over the last while I've noticed more and more of the pages on C-C seem to appear with a black background to them. Most have the proper white background, yet certain ones like the Contest Prize page have a black background instead of white. The current "top" news page on C-C.com is about the set archive: When I follow the link I end up with the following looking page,
Link

Highlighting the text makes it readable, but I'm sure this isn't supposed to be this way. I assume it's "my problem" since no one else I've seen has complained. Any idea why this happens?

[lemon_squeezer2]

This isn't happening to me, so, as you said, it must be your computer. What browser do you use? That might be one factor. Also, check your internet settings. It could be that something got messed up and that is the cause of your problem.

[J1A3L5]

This isn't happening to me, so, as you said, it must be your computer. What browser do you use? That might be one factor. Also, check your internet settings. It could be that something got messed up and that is the cause of your problem.

I thought about that, I use Mozilla. However, I tried it in IE, too, and it has the same result.

[Bruce N H]

Odd. I don't see this problem either. I'm using Mozilla on a Mac OSX.2

Bruce

[Formendacil]

I've had the same problem too.

On both of our computers.

Not only is it annoying, it looks bad.

Fortunately, I don't have to highlight the forum to read it.

[architect]

I believe this problem is due to some javascript code that mozilla may not be recognizing. The background color is still listed as #FFFFF so I am not sure why it is turning up black. The code slightly prevents people from stealing set images. This was a problem because they were being used for several commercial reasons, including many ebay auctions. I will work on getting a solution but it may take some time.

Ben E.

[Formendacil]

Both our computers have Explorer.

Hence, I have no idea if Mozilla has anything to do with it. I am certain, however, that it isn't limited to Mozilla if that is the case.

[J1A3L5]

As I said above, I've tried both IExplorer and Mozilla. (And Netscape, if that counts separate)

The other computer my parents use I tried in both Firefox and IE, and it works fine.

It's just an annoyance. I can still read the pages if I really want...I just don't unless there's a real reason. (Like the contest)

Thanks.

[MaxiVisVires]

I have the same problem with IE, usually it clears up with one hit of the refresh button. I think it's just the page loading the script incorrectly.

[rogue27]

I believe the problem is caused by some outdated browsers not handling style sheets correctly. Anybody having problems should consider updating to the latest version of their browser. Mozilla users may wish to instead use Firefox, and Internet Explorer users should probably stop. (hehe!)

Why do I think it is a style sheet problem? Because the four big links in the middle of the page use the following inline style tags: (BTW, inline style tags are typically a bad idea)

<a href="custom.html"style="text-decoration:none; color:black">

Note the "color:black" in there. That code is supposed to make the link text black, but it's possible that some browsers are interpreting it poorly and making the whole area black.


It's also possible that some other error on the site is causing the problem. I ran the page through the W3C HTML Validator (available here), and it displayed the following 16 errors:

Click For Errors

Granted, the majority of the errors here are trivial and will not cause a problem. However, this one is fairly significant and may warrant investigation:

4. Line 61, column 139: duplicate specification of attribute "ONLOAD"

BTW, I'm rather proud of you guys for having only 16 errors. Many large corporate web sites will have hundreds on a page.

I hope this helps.

[Robin Hood]

As Mike said, we have this problem too. Its inconsistent. One time I go to the page with the catagorys for the contest and it is normal, the next time its black. It might have something to do with the age of things. Though I think that it just doesn't load correctly all the time.


Dan

[architect]

Thank you Rogue for your suggestions. The page which points out the errors is helpful. For the Onload script can it have more than one feature? Can it prevent image theft and also run the left menu images? Well, actually it is doing this now, but is there a better way of coding this?

Most of the other needed corrections do seem minor and can be fixed along with the "style" entries. Again, I will work on this sometime in the future, but maybe not right away.

Ben E.

[rogue27]

For the Onload script can it have more than one feature? Can it prevent image theft and also run the left menu images? Well, actually it is doing this now, but is there a better way of coding this?

Yes, you just need to separate each function call with a semicolon (;) like so:

onLoad="do_something(); do_Something_else();"

The second semicolon is not required, but it is good practice. To be more specific to the page in question:

onLoad="trap(); MM_preloadImages(lots of parameters);"

(This stuff stays inside of the <body> tag where it currently is)

* * * * * * * * * * * * * * * * * * * * * * * * * * *

While I'm yapping, I may as well talk about those inline style tags. It is generally best to keep all of your style definitions in one place. You can use an external style sheet (which is the best option, but I won't explain how to do because I don't remember off the top of my head), or place the style definitions between <style> and </style> tags somewhere within the head of the document. (Within the head would mean between the <head> and </head> tags)

Instead of giving those four links on the sets page inline style tags, you could instead give them a "class" to mark them as being different than the rest of the links on the page. Example:

<a href="the_url" class="blackLinks">

Class can equal whatever term makes sense for you. Now you just have to add some style definitions for this class of link:

<style>
<!--

a.blackLinks
{
text-decoration:none;
color:black;
}

body
{
margin: 0px;
}

-->
</style>

Notes:
* This style stuff must be in the head
* You need to surround the contents of the <style> tag with HTML comments (<!-- blah blah blah --> so it will be ignored by older browsers that do not understand the style information.
* Where it says "a.blackLink", "blackLink" should be whatever class value you have specified for the links you want the style applied to. Just using "a" without a ".something" after it will apply the style to all links.
* the body stuff is included to show how to format multiple style entries within one set of style tags (which is how you should do it) Also, the body style above will allow you to remove the margin attributes from the <body> tag that were generating some of the (minor) error messages on the HTML validator.
* If you want to know how to have the style information on a separate page instead, Google for "HTML <link> CSS"


Benefits to doing the style tags this way:
* This method is more widely supported by browsers than using inline style tags.
* If you want to change the style tags, you only need to change them in one place instead of many.
* Code is easier to read
* On larger samples, this method will result in smaller file sizes which uses up less server space and bandwidth.


Oh... wow, I didn't mean to go into such a long explanation on CSS. Oh well, it passes time while I'm at work and it may be of some benefit.