Solved

Style to set color for table row

Posted on 2008-06-09
6
364 Views
Last Modified: 2012-05-05
I have the following style set up to make the font color red for the row, but it's not changing the color - any ideas why not?
<tr style="color:Red; " onMouseOver="style.background='#ffff77';" onMouseOut="style.background='';">
  <td valign="top">Joe Bloggs</td>
...
</tr>

Open in new window

0
Comment
Question by:Terry Woods
  • 3
  • 2
6 Comments
 
LVL 14

Expert Comment

by:tomaugerdotcom
ID: 21747120
since TR cannot contain text, you can't use the color style there. try these things:

<tr onMouseOver etc....><td style="vertical-align:top; color: red;">Joe Bloggs</td>...</tr>
0
 
LVL 14

Expert Comment

by:tomaugerdotcom
ID: 21747128
or, better, stay away from inline styles altogether:

<table id="myTable">
  <tr onMouseOver.....>
    <td>Joe Bloggs</td>
.....
  </tr>
....
</table>

<style type="text/css">
    table#myTable td { vertical-align:top; color:red; }
</style>
0
 
LVL 35

Author Comment

by:Terry Woods
ID: 21747160
There are more cells in the table row, and I want the whole row to have red text with minimal style code. But not every row is to have red text. If I use a style sheet, will I need to (say) specify a css class for each cell in the rows that need red text?
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 42

Expert Comment

by:David S.
ID: 21747182
You could apply a class to each row instead of each cell.
0
 
LVL 14

Accepted Solution

by:
tomaugerdotcom earned 300 total points
ID: 21747223
I'm going to simplify the code a bit to save time
<table id="myTable">
 <tr class="redRow">
   <td>Red stuff</td>
 </tr>
 <tr>
   <td>This stuff is not red</td>
  </tr>
</table>

the stylesheet for this would be
table#myTable tr.redRow td { color:red; etc...}
0
 
LVL 35

Author Comment

by:Terry Woods
ID: 21747269
Just what I needed - thanks so much for the quick response!
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
CSS in HTML 5 51
CSS - Centering an image 2 22
CSS for <center> 14 31
How do I Enable submit button only if listbox has items 4 27
When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
The viewer will learn how to dynamically set the form action using jQuery.

679 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question