Jag har ett interaktivt korsord som är uppbyggt av en tabell där rutnätets utseende beror av olika CSS-klasser. Detta funkar fint nästan hela vägen... men tyvärr inte riktigt överallt. En normal vit ruta har CSS-klassen vit, om den vita rutan innehåller en svängande pil, används CSS-klassen turnXY. (Där XY beror på hur den svänger.) När korsorden kollas, jämför jag inskrivna ord mot avsedda från en databas, och om dessa bokstäver inte stämmer får rutan CSS-klassen facit i tillägg till övrig klass. Facit är avsedd att göra texten röd.
Detta funkar fint för vanliga vita rutor, men verkar inte ha någon effekt på svängande sådana?? :q Hur är det möjligt?
Ett exempel för tydlighets skull: (Den feta bokstavens ruta innehåller en svängande pil.)
Inskrivet ord: WALLS
Riktigt ord: JAMES
Borde färgats enligt: JAMES
Resulterar i följande korrekta HTML: (Utdrag)
<td id="td_D1" class="vit facit">J</td> == > Röd (Riktigt, ty fel bokstav)
<td id="td_D2" class="vit">A</td> ==> Svart (Riktigt, ty rätt bokstav)
<td id="td_D4" class="turnDF facit">E</td> ==> Svart (FEL, ty fel bokstav)
Se också bifogad bild. (Klasserna blir alltså rätt, men inte färgen i browsern.)
/* I CSS-filen */
#cw td.vit {
background:url(vitRuta.gif); /*genomskinlig*/
background-color:#ffffff;
color:black;
font-weight: bold;
border:1px solid black;
padding:5px;
margin:0;
width:1em;
}
#cw td.facit {
color: #DC143C;
font-weight: bold;
border:1px solid black;
padding:5px;
margin:0;
width:1em;
}
#cw td.turnDF { /* Down -> Forward */
background:url(arrowDownToForw.gif); /*genomskinlig*/
background-color:#ffffff;
color:black;
font-weight: bold;
padding:5px;
margin:0;
width:1em;
}
Vad 17 är det som gör att "vit facit" ==> röd text, men "turnDF facit" ==> svart??? :q
Detta gäller både IE (v 6.0) och FF.
