[Last Call] Learn about multicloud storage options and how to improve your company's cloud strategy. Register Now

x
?
Solved

css

Posted on 2007-03-21
5
Medium Priority
?
296 Views
Last Modified: 2010-04-09
Hi,

Please assist is it possible to add name to a <TD> so that it would change the color depending o n the TD's name? I'd like to know how can we add it in the CSS file below.

<table name ="old">
<tr>
<td name="red">this background will now turn red
</td><td>normal</td>
</tr>
</table>

Thanks


table #old ,#old td,#old th{
      font-size:100%;
      font-family: Arial;
      border:1px solid #666;
      border-collapse:collapse;
      margin:0;
      padding:0;
}
#old td,#old th{
      font-size:90%;
      padding:.2em .5em;
      font-weight:bold;
      vertical-align:top;
      font-weight:normal;
}
#old thead th{
      font-weight:bold;
      font-family: Arial;
      background:#FFD735;
      font-size: 11px;
      color:black;
}
#old tbody td{
      font-size:70%;
      background:#ccc;
}
#old tbody th{
      font-size:70%;
      background:#999;
}
#old tbody tr.odd td{
      font-size:70%;
      background:#eee;
}
#old tbody tr.odd th{
      font-size:70%;
      background:#ccc;
}
#old caption {
      background:#666;
      color:#fff;
      font-weight:bold;
      text-align:left;
      font-size:75%;
}
0
Comment
Question by:FrankPorter
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 9

Accepted Solution

by:
under_dog earned 2000 total points
ID: 18762680
You want to give the TD a class rather than a name like:

<table name ="old">
<tr>
<td class="red">this background will now turn red
</td><td>normal</td>
</tr>
</table>

and then add this to your styles:

.red {

  background-color: red;

}
0
 

Author Comment

by:FrankPorter
ID: 18762760
sad to say the color didnt change, ther must be something wrong with the declaration in the style file.

i added this to the end

.red {

  background-color: red;

}
0
 
LVL 9

Expert Comment

by:under_dog
ID: 18762785
It works for me ... here is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
      table #old ,#old td,#old th{
              font-size:100%;
              font-family: Arial;
              border:1px solid #666;
              border-collapse:collapse;
              margin:0;
              padding:0;
      }
      #old td,#old th{
              font-size:90%;
              padding:.2em .5em;
              font-weight:bold;
              vertical-align:top;
              font-weight:normal;
      }
      #old thead th{
              font-weight:bold;
              font-family: Arial;
              background:#FFD735;
              font-size: 11px;
              color:black;
      }
      #old tbody td{
              font-size:70%;
              background:#ccc;
      }
      #old tbody th{
              font-size:70%;
              background:#999;
      }
      #old tbody tr.odd td{
              font-size:70%;
              background:#eee;
      }
      #old tbody tr.odd th{
              font-size:70%;
              background:#ccc;
      }
      #old caption {
              background:#666;
              color:#fff;
              font-weight:bold;
              text-align:left;
              font-size:75%;
      }
      .red {
            background-color: red;      
      }

</style>
</head>

<body>
<table name ="old">
<tr>
<td class="red">this background will now turn red
</td><td>normal</td>
</tr>
</table>

</body>
</html>
0
 

Author Comment

by:FrankPorter
ID: 18762792
what application do you use to edit web pages?
0
 
LVL 9

Expert Comment

by:under_dog
ID: 18762812
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

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

Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

650 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