PDA

Click to See Complete Forum and Search --> : CSS classes not working for me.

asolell
06-15-2003, 02:08 AM
Hi all,
I have a table that I want to have it's tableheaders placed in a class.
I don't get the same results in using the CSS as when I'm not.
The colors are differenet.

See the border between text 5 and text 6 and compare
them to the border between text 2 and text 3.

Thanks for your help.

-Alon.




<html dir="rtl">
<head>
<title>Test of CSS</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1255">
<meta http-equiv="Pragma" content="no-cache;">
<meta http-equiv="expires" content="Thu, 1 October 1998 00:00:00 PST">
<STYLE type="text/css">
<!--
.tablecell {
color: #000000;
text-decoration: bold;
background-color: #FFFFFF;
}
.tableheader {
color: #000000;
background-color: #000000;
border-color: #008080;
}

-->
</STYLE>

</head>
<body bgcolor="#99CCFF" text="#000000">
<FONT face="Arial" size="1">CheckForDeleteInventoryItem.php</font>


<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="660" id="AutoNumber1">

<tr>
<td width="14">&nbsp;</td>
<td width="818">
<center>

<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="632" id="AutoNumber2" height="21">
<tr>


<th width="117" height="19" bgcolor="#000000" bordercolor="#008080">
<font face="Arial" size="2" color="#FFFF00">text 3</font></th>
<th width="263" height="19" bgcolor="#000000" bordercolor="#008080">
<font face="Arial" size="2" color="#FFFF00">text 2</font></th>
<th width="60" height="19" bgcolor="#000000" bordercolor="#008080">
<font face="Arial" size="2" color="#FFFF00">text 1</font></th>
</tr>


<tr>
<td width="117" height="19" bgcolor="#FFFF00">&nbsp;</td>
<td width="263" height="19" bgcolor="#FFFF00">&nbsp;</td>
<td width="60" height="19" bgcolor="#FFFF00">
&nbsp;</td>
</tr>
<tr>
<td width="117" height="19" bgcolor="#FFFF00">&nbsp;</td>
<td width="263" height="19" bgcolor="#FFFF00">&nbsp;</td>
<td width="60" height="19" bgcolor="#FFFF00">
&nbsp;</td>
</tr>
</table>
</center>
</td>
<td width="20">&nbsp;</td>
</tr>
</table>


<BR>
<BR>

<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="660" id="AutoNumber1">

<tr>
<td width="14">&nbsp;</td>
<td width="818">
<center>


<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="632" id="AutoNumber2" height="21">
<tr>


<th width="117" height="19" CLASS=tableheader>
<font face="Arial" size="2" color="#FFFF00">text 6</font></th>
<th width="263" height="19" bgcolor="#000000" bordercolor="#008080">
<font face="Arial" size="2" color="#FFFF00">text 5</font></th>
<th width="60" height="19" bgcolor="#000000" bordercolor="#008080">
<font face="Arial" size="2" color="#FFFF00">text 4</font></th>
</tr>


<tr>
<td width="117" height="19" bgcolor="#FFFF00">&nbsp;</td>
<td width="263" height="19" bgcolor="#FFFF00">&nbsp;</td>
<td width="60" height="19" bgcolor="#FFFF00">
&nbsp;</td>
</tr>
<tr>
<td width="117" height="19" bgcolor="#FFFF00">&nbsp;</td>
<td width="263" height="19" bgcolor="#FFFF00">&nbsp;</td>
<td width="60" height="19" bgcolor="#FFFF00">
&nbsp;</td>
</tr>
</table>
</center>
</td>
<td width="20">&nbsp;</td>
</tr>
</table>
</table>


</body></html>
Mr J
06-15-2003, 03:03 AM
in your

.tableheader {
color: #000000;
background-color: #000000;
border-color: #008080;
}


Change

border-color: #008080;


To

border-left: #008080;


I don't admit to fully understanding why it works but it did for me.

I have IE5.5
Mr J
06-15-2003, 08:41 AM
Hi Dave.

I tried that but it did not give a border that matched the rest
Mr J
06-15-2003, 12:04 PM
The rest of the other borders
asolell
06-15-2003, 12:59 PM
Hi Dave,

Thanks for your help on this.

I too didn't get a matching border with the rest of the borders.
But I resolved that part.

Your input was of .tableheader { border: 2px solid #008080 }

and once I chaged the 2px to 1px, it finally gave the matching border width to cell number 6.

Finally!
:)

Thanks for your help. This is a great learning experience for me.

I'm gonna play more with the rest of table and hopefully the example we worked here will be tranferable to the rest of it.

Thanks again.

-Alon.
Mr J
06-15-2003, 01:00 PM
To be honest Dave I am a bit puzzled I copied the code that asolell posted and when you view with the browser it shows the table cells in order Text1, text2, text3.

Yet when I look at the code I see

<tr>
<th width="117" height="19" bgcolor="#000000" bordercolor="#008080"><font face="Arial" size="2" color="#FFFF00">text 3</font></th>

<th width="263" height="19" bgcolor="#000000" bordercolor="#008080"><font face="Arial" size="2" color="#FFFF00">text 2</font></th>

<th width="60" height="19" bgcolor="#000000" bordercolor="#008080"><font face="Arial" size="2" color="#FFFF00">text 1</font></th>
</tr>

Notice that the first TH is text3, surely this should be text1 unless TH's run in reverse order

And when I amended to include your CSS attribute only the last TH cell border changed and not the others