juerg: CSS -klassen

Beitrag lesen

SELF-Forum

CSS -klassen

juerg
– Informationen zu den Bewertungsregeln

hi
ich habe eine tabellenklasse "Cformat" mit den elementen td und th definiert. soweit so gut. als spezialfall gibt es einen "Spacer" des elementes td. das element habe ich mit der klasse Spacer versehen. die darstellung entspricht aber denjenigen td elementen ohne klasse.
ich habe ein code beispiel mit erläuterungen beigelegt.

frage: was ist an "table.Cformat td.Spacer" { } falsch? was entspricht nicht dem CSS-Standard? wie kann ich ein td child der klasse Spacer von table.Cformat formatieren?
frage: weshalb ist "table.Cformat td" trotz definierter klasse dominant?

danke für einen tipp.
have fun jürg

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>
</head>
<style type="text/css">
 table { background-color:maroon; }
 thead, th { background-color:maroon; }
 tbody, td { background-color:maroon; }
 tfoot { background-color:maroon; }
 table.CFormat {
  table-layout:auto; padding:1px;
  margin: 1px 1px 1px 10px;
  border-collapse:separate; background-color:#f0f0f0;
  border:1px none red;
 }
 table.Cformat td.Spacer {
  border-width:1px; border-style:solid; background-color:red;
 }
 table.CFormat td {
  padding:10px;
  text-align:left; background-color:yellow;
  border-width:1px; border-style:solid;
                border-color:silver white white silver;
 }
 table.CFormat th {
  text-align:left; background-color:silver; padding:10px;
  border-width:1px; border-style:solid;
                border-color:silver white white silver;
 }
</style>
<body border="1" bgcolor="#D2E2EC">
maroon-farben sind falsch.
frage: was ist an "table.Cformat td.Spacer" { } falsch?<br/>
frage: weshalb ist "table.Cformat td" trotz definierter klasse domininant?<br/>
<table class="CFormat" width="96%" height="100%" align="left" cellspacing="1" cellpadding="10">
 <tr><th>
  expect silver, ok
 </th><tr>
 <tr>
  <td class="Spacer">expect red, yellow is wrong</td>
 </tr>
 <tr>
  <td>expect yellow, ok</td>
 </tr>
 <tr><th>expect silver
 </th></tr>
</table>
</body>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln