Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Overriding StyleSheet settings 1

Status
Not open for further replies.

calista

Programmer
Jan 24, 2001
545
US
I am redoing my pages with style sheets, but I've run into a small snag. I have an externally linked style sheet that sets all the attributes for all the <TABLE> elements including <TH>, <TR>, and <TD>. However, on a couple of my tables, I want to alternate the colors for <TD>. I used to use the folowing code code to do this:
Code:
<TABLE>
	<cfif #CurrentRow# MOD 2 EQ 0>
		<cfset Color=&quot;#Application.Lighter#&quot;>
	<cfelse>
		<cfset Color=&quot;#Application.LightColor#&quot;>
	</cfif>
		<TR>
   			<TD BGCOLOR=&quot;#Color#&quot;><A HREF=&quot;DiscussionIndex.cfm?Forum=#GetForums.ForumID#&quot;>#GetForums.ForumName#</a></TD>
		</TR>
	</TABLE>

This no longer works with the style sheet. I thought if I specified attributes (like BGCOLOR) in the tag, it would override the style sheet settings. It doesn't. Or, is there a better way?
Thanks!
 
you could use an inline style sheet placed in between the head tags and refer to it in your code (i.e., <td style=&quot;green&quot;> etc. This would override the external style sheet only for the specified tags with the other tags using the external style.
 
I believe CSS works with inheritance, like html does. The external file can be overridden by style in the head, which could be overridden by inline use of style, like inside of a tag. That said, if you have <td> defined in a external css and want to make an inline change to <td>, write your style right there with the tag, like this...

<td style=&quot;bgcolor:#CCCCCC; cursor:hand&quot;>and that's it</td>

hope this helps
 
Calista, ruby's right, that should do the trick.

Also, if you have several tables throughout your site, but out of all the tables there are two basic formats you use, you could create two classes.

Lose the TABLE part of your style sheet and replace it with .table1 and for all of the tables that use that style, just include STYLE=&quot;table1&quot; in the <TABLE> tag. For the tables that don't use that style, just leave the STYLE attribute out of the <TABLE> tag, or create another element in your style sheet and call it .table2

Dig? ;-) Kevin
slanek@ssd.fsi.com
 
I would agree with Kevin.

Be carefull with your naming conventions with CSS.

A tip is to make a list of the stuff you want to do and use sensible non html tags for the CSS ref stuff.

Mainc -----------------------------
I've broken it again !!
-----------------------------
 
Hi, folks!

I tried the inline style change, and I haven't gotten it to work. Here is what I have, maybe I missed puncuation somewhere.(I don't know what color #CCCCCC is, I just used it so any change would be obvious)
Code:
<TABLE>
<TR style=&quot;bgcolor:#cccccc;&quot;>
	<TD><A HREF=&quot;DisplayMessage.cfm?ThreadID=#URL.ThreadID#&First=#CurrentRow#&quot;>#MsgSubject#</A></TD>
	<td>#PersonFirstName# #PersonLastName#</td>
	<TD>#MsgDatePosted#</TD>
</TR>
</TABLE>
Kevin, Manic, I see what you're saying, but I'm still not sure how I would get alternating row colors with a style sheet, even defining two different ones, which, BTW, sounds like a good idea to me. Thanks for all of your input! You've all been very helpful. :)
 
Calista, if you're doing it within a <CFOUTPUT> tag, try using a double pound in front of your color:
##CCCCCC

ColdFusion may be ignoring it.

To do the alternating row colors, do exactly what you're already doing with MOD, but you'll need to take the TR out of your style sheet. That should do the trick for ya. With a table, I've found it best not to have TR or TD defined in my style sheet, rather develop a class or ID to handle it. That way, all your TRs and TDs won't have to take on the same styles if you don't want them to. Kevin
slanek@ssd.fsi.com
 
Calista,
Just a syntax problem I think, try:

<TR style=&quot;background:#ccff33&quot;;&quot;>

should work.

Cheers,
Joe.
 
Calista,
Just a syntax problem I think, try:

<TR style=&quot;background:#ccff33&quot;;&quot;>

should work.

Cheers,
Joe.
 
Thanks, people! I've got it, now. Kevin, you were right. I took out my definition for <TR>, and I took out all the attributes I defined for <TD> except for a border I wanted. Then I was able to change row colors on the fly.

Calista :-X
 
Just for reference: an color that has all the same values, i.e. #000000, #444444, #cccccc, $ffffff, would be some shade of &quot;gray&quot; from white (#ffffff) to black (#000000). #cccccc would be a shade of light gray.
Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top