Border in table exceeds row

Question

Anyone knows if this is a browser bug or please tell me if I'm doing something wrong:

I have a table like this:

    <tr>
      <td class="title" width="200">123456</td>
      <td class="info" rowspan="2">123456789</td>
    </tr>
    <tr><td style="border:none!important"></td></tr>

The CSS for it is this:

     td.title {
            height:35px;
            border-top:2px solid #8e857b;
            border-bottom:2px solid #8e857b;
            border-right:2px solid #8e857b;
            margin:3px;
            padding:3px;
            font-size:13px;
            text-transform:uppercase;
        }



        .table-unidades td.info {
            font-size:12px;
            padding:5px 20px;
            border:none;
        }

And for some reason, the right border of the 1st cell overflows to the next row... I've tried a couple of things and nothing...

I wanted to show you a snapshot but I'm not allowed... here's a link to the original webpage:

http://primerclic.com.mx/clientes/frisco/22.html

Answer 1

You can use border-collapse:separate. Here is more info about it http://www.w3schools.com/cssref/pr_border-collapse.asp