• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 375
  • Last Modified:

Style to set color for table row

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
Terry Woods
Asked:
Terry Woods
  • 3
  • 2
1 Solution
 
tomaugerdotcomCommented:
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
 
tomaugerdotcomCommented:
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
 
Terry WoodsIT GuruAuthor Commented:
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
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
David S.Commented:
You could apply a class to each row instead of each cell.
0
 
tomaugerdotcomCommented:
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
 
Terry WoodsIT GuruAuthor Commented:
Just what I needed - thanks so much for the quick response!
0

Featured Post

2018 Annual Membership Survey

Here at Experts Exchange, we strive to give members the best experience. Help us improve the site by taking this survey today! (Bonus: Be entered to win a great tech prize for participating!)

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now