Ok, found the solution

        <!--[if IE 6]>
            <style>     
                        table{ border-collapse: collapse;}
                </style>        
        <![endif]-->
    <style>
            table{  border-spacing: 0; }
           .top { border-top: 1px solid #000; color:#F0F; }
           .bottom { border-bottom: 1px solid #000; color:#F0F }           
        </style>

thanks :-)

ps. check out the IE-Tab plugin for FF!



ggerri wrote:
> 
> 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...
> 
> Pleaaase enlighten me :confused::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-tp23756705s27240p23757235.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.

Reply via email to