colgroup problem med safari och firefox

Tråden skapades 2004-10-29 och har fått 1 svar. Det senaste inlägget skrevs 2004-11-05.

1

2004-10-29 14:14

#1

Gäst
Oregistrerad ●
2004-10-29 14:14

Skulle vilja gruppera samt style columner i en tabell och till min förvåning kan jag inte få colgroup eller col till att fungera med vissa attribut.

Att sätta border style är inga problem men att påverka align eller text färg verkar svårare.

Titta på följande exempel. Allt fungerar förutom text-align: right; på *#col1.

<!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" xml:lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
	<title>Untitled</title>

<style type="text/css" title="text/css">
	table
	{
		border-collapse: collapse;
		border: 5px solid yellow;
		width: 50%;
	}
	
	*#col1
	{
		border: 3px solid black;
		color: black;
		text-align: right;
	}
	
	td	
	{
		border: 1px solid red;
		padding: 1em;
		text-transform: inherit;
	}
	
	td.solid-blue { border: 5px dashed blue; }
	td.solid-green { border: 5px solid green; }
</style>
</head>
<body>

<table>
<colgroup>
<col id="col1" /><col id="col2" /><col id="col3" />
</colgroup>
<tr id="row1">
    <td> 1</td>
    <td> 2</td>
    <td> 3</td>
</tr>
<tr id="row2">
    <td> 4 </td>
    <td class="solid-blue"> 5</td>
    <td class="solid-green"> 6</td>
</tr>
<tr id="row3">
    <td> 7</td>
    <td> 8</td>
    <td> 9</td>
</tr>
<tr id="row4">
    <td> 10</td>
    <td> 11</td>
    <td> 12</td>
</tr>
<tr id="row5">
    <td> 13</td>
    <td> 14</td>
    <td> 15</td>
</tr>
</table>


</body>
</html>

Anmäl Ändra Gilla Svara

2004-11-05 10:29

#2

Gäst
Oregistrerad ●
2004-11-05 10:29

Då var det löst. Eller rättare sagt så har jag gjort en workaround.

Jag löste det genom att fånga tabellen (getElementById) sedan tabellens celler genom getElementsByTagName. Sedan kontrollerar jag om cellerna är av den "class" som skall manipuleras. Att tänka på här är att IE refererar till class via className och inte class. Följande linje löser detta.

var classes = objs[i].getAttribute('className') || objs[i].getAttribute('class');

Fast det hade ju varit mer behändigt om man kunde gruppera med <col>