CSS Forum

**Tranix.net** · 01-21-2006, 01:49 PM

I know there is something wrong with the css but have no clue where/how to fix it. Many visitors complaint me about the dark color on the site but in fact it views okay on IE and Opera browsers

. Could someone please take a look at the css below and figure out what wrong with it?

<style type="text/css">

</style>

I truly need your help

Tranix

**angele803** · 01-21-2006, 08:58 PM

hmmm, Im not sure. Can you give the web address so we can see the html code as well?

**neroux** · 01-21-2006, 09:49 PM

Are you referring to tranix.net?

About which parts do you receive complaints? I cant note a difference whether in IE, Firefox or Opera. Also by using the CSS you supplied I dont see a difference.

HTML Code:

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
td {
font-family : Tahoma;
font-size : 11px;
color : #474747;
}
BODY {
FONT-FAMILY: Tahoma, Verdana; FONT-SIZE: 12pt
}
A {
FONT-FAMILY: Tahoma, Verdana; FONT-SIZE: 12pt; TEXT-DECORATION: under; outline: none
}
A:link {
FONT-SIZE: 12px; FONT-WEIGHT: bold; COLOR: #013C9A; FONT-FAMILY: Arial, Verdana, Tahoma, Helvetica, sans-serif; 
LETTER-SPACING: 0px; 
TEXT-DECORATION: underline
}
A:visited {
FONT-SIZE: 12px; FONT-WEIGHT: bold; COLOR: #013C9A; FONT-FAMILY: Arial, Verdana, Tahoma, Helvetica, sans-serif; LETTER-SPACING: 0px; 
TEXT-DECORATION: underline
}
A:hover {
FONT-SIZE: 12px; COLOR: #2299FF; FONT-FAMILY: Arial, Verdana, Tahoma, Helvetica, sans-serif; LETTER-SPACING: 0px; 
TEXT-DECORATION: none
}
A:active {
FONT-SIZE: 12px; COLOR: #013C9A; FONT-FAMILY: Arial, Verdana, Tahoma, Helvetica, sans-serif; LETTER-SPACING: 0px; 
TEXT-DECORATION: none
}
a.7 {FONT-SIZE: 12px; text-decoration: underline; color: #FFE400; } 
a.7:link {FONT-SIZE: 12px; text-decoration: underline; color: #FFE400; } 
a.7:visited {FONT-SIZE: 12px; text-decoration: underline; color: #FFE400; } 
a.7:hover {FONT-SIZE: 12px; text-decoration: none; color: #FFFFFF; } 
a.1 {text-decoration: underline; color: #000000; } 
a.2 {text-decoration: underline; color: #FFCC00; } 
a.3 {text-decoration: underline; color: #828282; }
a.4 {text-decoration: underline; color: #004C86; } 
a.5 {text-decoration: underline; text-transform:uppercase; font-weight:bold; color: #949494; } 
a.5:link {FONT-SIZE: 11px; text-decoration: underline; color: #949494; } 
a.5:visited {FONT-SIZE: 11px; text-decoration: underline; color: #949494; } 
a.5:hover {FONT-SIZE: 11px; text-decoration: none; text-transform:uppercase; font-weight:bold; } 
a.6:link {FONT-SIZE: 9px; text-decoration: underline; color: #949494; } 
a.6:visited {FONT-SIZE: 9px; text-decoration: underline; color: #949494; } 
a.6:hover {FONT-SIZE: 9px; text-decoration: none; color: #2299FF; } 
a.8:link {text-decoration: underline; color: #013C9A; font-size: 13px; } 
a.8:visited {text-decoration: underline; color: #013C9A; font-size: 13px; } 
a.8:hover {text-decoration: none; color: #2299FF; font-size: 13px; } 
-->
</style>
</head>

<body>
<table border="1">
  <tr>
    <td>test</td>
  </tr>
</table>
test<br />
<a href="test">test-link</a>
</body>
</html>

**Tranix.net** · 01-22-2006, 01:49 AM

because I set each nag. box with different colour and font size but somehow on Firefox browser it only show one body css

**vangogh** · 01-22-2006, 02:03 AM

I'm seeing the site display the same in Firefox and IE as well. What part of the site is displaying too dark. I'm only seeing the colors above defined on text and links. You also mention Firefox only showing the css for one body, but I only see css applied to the body once in the code you posted.

Can you be more specific about what on the site is showing too dark. I'll be happy to take a look if I can better understand the problem.

**Tranix.net** · 01-22-2006, 03:18 AM

Quote:

Originally Posted by vangogh

I'm seeing the site display the same in Firefox and IE as well. What part of the site is displaying too dark. I'm only seeing the colors above defined on text and links. You also mention Firefox only showing the css for one body, but I only see css applied to the body once in the code you posted.

Can you be more specific about what on the site is showing too dark. I'll be happy to take a look if I can better understand the problem.

vangogh, please take a look at these two attaches. I also have encountered a weird problem on different screen resolution lately today which the main body content shift down so the page division didn't show up. I'm glad that I fixed it or else, visitors would think my site doesn't have much vids

[1] 2 3 4 » Last page (10 pages)

Thanks for the help everyone,
Tranix

**vangogh** · 01-22-2006, 03:56 PM

Hey Tranix. Sorry my bad. I didn't scoll down the page far enough. The problem is a simple one. You can't start your classes with a number (IE is letting yo get away with it, but the more standars compliant browsers are stumbling on it). If you change class="7" to class="a7" say and then update the coresponding css it should work the same in both browsers.

It'w always a good idea to give your classes and ids more meaningful names though. For example the classes of the popular media section might have a class="pop-media"

It's might not seem like a big deal, but as you add more styles and come back to work on something you've been away from for a few months it can really help alot to remind you what the code is referring to.

**Tranix.net** · 01-23-2006, 01:51 AM

Quote:

Originally Posted by vangogh

Hey Tranix. Sorry my bad. I didn't scoll down the page far enough. The problem is a simple one. You can't start your classes with a number (IE is letting yo get away with it, but the more standars compliant browsers are stumbling on it). If you change class="7" to class="a7" say and then update the coresponding css it should work the same in both browsers.

It'w always a good idea to give your classes and ids more meaningful names though. For example the classes of the popular media section might have a class="pop-media"

It's might not seem like a big deal, but as you add more styles and come back to work on something you've been away from for a few months it can really help alot to remind you what the code is referring to.

Well, I can't thanks you enough my friend

I was struggling with it for days but couldn't figure out WHY? other people from different forums don't know either

Very much appreciated it

Tranix

**vangogh** · 01-23-2006, 02:13 AM

Glad to help. I know how frustrating some of this stuff can be at times.