Hi there
I know it must be simple but I'm just stuck here :,(
I have to ad a line between some rows, but not for the first col.
the table has:
table { border-collapse: collapse }
that is fix and I can not change it.
the following sample code draws the lines nicely in IE6 but in FF there's
just nothing (also used color here, to see if the selectors are right):
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<script type="text/javascript" src="jquery.js"></script>
<style>
table{ border-collapse: collapse; }
.top { border-top: 1px solid #000; color:#F0F }
.bottom { border-bottom: 1px solid #000; color:#F0F }
</style>
<script type="text/javascript">
$(function()
{
var vTRs = $('[name=TABLE_1] tr').length;
$('[name=TABLE_1] tr').each(function(i){
switch (i) {
case 2:
$(this).find('td:gt(0)').addClass('bottom');
break;
case 3:
// thought that might
help with collapse..
//
$(this).find('td:gt(0)').addClass('top'); break;
}
});
}
);
</script>
</head>
<body>
<table width="200" name="TABLE_1">
<tr>
<td>aaa</td>
<td>9999</td>
<td>9999</td>
</tr>
<tr>
<td>bbb</td>
<td>9999</td>
<td>9999</td>
</tr>
<tr>
<td>ccc</td>
<td>9999</td>
<td>9999</td>
</tr>
<tr>
<td>ddd</td>
<td>9999</td>
<td>9999</td>
</tr>
</table>
</body>
</html>
simple enough right? :confused:
Funny thing: When I do it without jquery and assign the classes right to the
TDs, it works fine in both browsers...
Any one not as dumb as me? :-D:working:
Thanks a lot :-)
Gerald
--
View this message in context:
http://www.nabble.com/border-bottom-in-cells-fails-in-FF-but-works-in-IE6---arrgghh-tp23756705s27240p23756705.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
