HTML-таблица и выравнивание по границе

Question

Я пытаюсь выровнять границы двух таблиц. Пожалуйста, взгляните на этот небольшой пример http://jsfiddle.net/kf82J/2/

В Internet Explorer и Chrome правая рамка не выровнена, но работает в Firefox.

Моя цель - нарисовать линию, которая «выравнивает» ширину в середине названия, ее трудно объяснить словами, просто проверьте jsfiddle.

же код ниже

<table style="width:100%;border-collapse: collapse;"> 
    <tr style="height: 10px;"> 
     <td style="width: 1px;"> 
     </td> 
     <td rowspan="2" style="font-size:19pwhite-space:nowrap;x;width:1px;"> 
      Title &nbsp; &nbsp; 
     </td> 
     <td style="height:50%;"> 
     &nbsp; 
     </td> 
    </tr> 
    <tr style="height: 10px;"> 
     <td> 
     </td> 
     <td style="height:50%;border-top: 1px solid black; border-right: 1px solid black;"> 
     &nbsp; 
     </td> 
    </tr> 
</table> 
<table style="width:100%;border-collapse: collapse;border:1px solid black;border-top:none;"> 
    <tr> 
     <td>Content</td> 
    </tr> 
</table> 

Answer 1

Удалить ниже линии от CSS для таблицы

border-collapse: collapse; 

Он работал для меня в скрипку.

Answer 2

В качестве альтернативы вы можете попробовать добавить прозрачную границу для первой таблицы

<table style="border:1px solid transparent;>