docnzok Posted January 21, 2016 Share Posted January 21, 2016 The Code element is a very powerful tool! Dont forget that CSS (Style Sheet Coding) is code also. Want your table to show alternate colors for rows? You can use a little CSS to do that! Just put the css code into a template at the top of a page and your table can have alternate colored rows. Use the same code (by changing a little text) on several pages using the templates! Here is a table example of where I use CSS to alternate the table row colors. This is just a registration survey table. (Some other things are going on here, but I wanted to show the CSS effects. Link to comment Share on other sites More sharing options...
SportsEngine Staffer Posted January 21, 2016 Share Posted January 21, 2016 Thanks, Mark! Can you share the actual code you used to build that table? - Loren Link to comment Share on other sites More sharing options...
docnzok Posted January 26, 2016 Author Share Posted January 26, 2016 Find your Table Name and insert it into the code used here. <style> #(YOUR TABLE NAME HERE) // Make all odd rows cool green tr:nth-child(even) { background-color: #E6F5CF;} // Make the text only in the 10th Column Red td:nth-child(10) {color: red;} </style> Link to comment Share on other sites More sharing options...
eribs4e Posted March 11, 2016 Share Posted March 11, 2016 I'd like to implement this functionality with one of my tables, but I'm unable to find the name of my table. I've used the Chrome inspector tool to look at all the source code and I don't see an id for the table element. The container (div) has an id, but the actual table doesn't. How do I assign the table a name (id) or is there another way to retrieve the information that I don't know of? Thanx in advance. Link to comment Share on other sites More sharing options...
SportsEngine Staffer Posted April 26, 2016 Share Posted April 26, 2016 That should have worked for you. Chrome's inspector should give you the option to get the right name by...finding the correct element in the elements tab, right clicking and selecting "copy selector". Try that. Will look like this: <style> #what you copied here { code here } </style> Link to comment Share on other sites More sharing options...
purplepear Posted August 26, 2016 Share Posted August 26, 2016 I've tried to use this code in the site I'm working on, but nothing is happening. I have the table name, too. Not sure what else to try. Link to comment Share on other sites More sharing options...
docnzok Posted August 29, 2016 Author Share Posted August 29, 2016 Purple Can you send me the link to the page where the table is please? I will write up a little CSS and test it and then try to help as best I can. Mark Link to comment Share on other sites More sharing options...
purplepear Posted September 8, 2016 Share Posted September 8, 2016 Thanks, Mark. I'd like to change the header row color, too. http://www.nationalrecruitingleague.com.prod.sportngin.com/page/show/2716828-division-descriptions Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.