Выровнять текст в соседних ячейках таблицы с границами разных размеров?

Мне нужна помощь в следующем коде, который отлично работает в Foxfire и - неожиданно - ужасно в IE9.

В FF он создает двухцветную полосу (строку таблицы) на странице с высотой 25 пикселей. (Я использовал много цветов фона нежелательной почты, чтобы увидеть, где существуют пробелы. И я знаю, что могу получить тот же эффект во всех css... НО есть другие Ячейки, которые мне нужно добавить вправо позже, что я никогда не был в состоянии для рендеринга в css, поэтому я сдался и сейчас бежал в "простую" таблицу.)

Таблица содержится в div с классом = "tabs-block">.
(Это было необходимо для того, чтобы заставить таблицу быть на 100% шириной. По какой-то причине такая же настройка при вводе id вместо класса не сработала. Не знаю, почему.)

Левая половина строки (ячейка 1) - пустая ячейка (без содержимого, размер шрифта установлен на 0px) - у нее есть белая граница 25px внизу и 25px синий справа (ни один сверху или влево) - - у него есть ORANGE с белым фоном, который не следует видеть, потому что нет никакого контента, и если бы он был, он был бы высок. В FF он не отображается. В IE9 он заглядывает сверху, что составляет несколько пикселей в ширину. (Желаю, чтобы я мог приложить снимок экрана, но я слишком новый.)

Правая сторона группы (ячейка 2) - это ячейка с голубым фоном - без границ - и она содержит единственную ссылку, текст которой 12pt белый

Белые (левые) ячейки Bule (справа) встречаются посередине, похоже, что между ними есть линия 45 градусов.

ПРОБЛЕМА: FF выравнивает текст ссылки в BOTTOM ячейки 2. IE9 выравнивает текст ссылки с пустой текстовой областью ячейки 2, то есть IE9 выравнивает текст ячейки 2 с верхней границей ячейки 1. НЕ дно ячейки 2. Это оставляет пробел в пробе в ячейке 2 = (25px минус 12pt).

После слишком многих дней полного поражения, мои глаза пересекли, и помощь приветствуется.

.tabs-block > table {
   background-color: white;
   text-align: right;
   width: 100%;}

table#tabs-table {
      border-collapse:collapse;
      width:100%;}

tr#tabs-row-1 {
  padding: 0px;
  margin:0px;
  border-spacing: 0px;
  background-color:red;}

<div class="tabs-block" style='background-color: green;'>
  <table cellspacing = '0px'
         cellpadding = '0px'  
         id='tabs-table;'>
     <tr id='tabs-row-1'>          
       <td style='width:50%;
                  margin:0px;
                  padding:0px;
                  background-color: orange;
                  border-style: solid;
                  border-color: #000066 #000066 #FFFFFF red;
                  border-width: 0px 25px 25px 0px;'
                  class='text-blue-0'></td>            
       <td style='width:1px; 
                  margin:0px;
                  padding:0px;
                  border:0px;
                  background-color: #000066;
                  white-space:nowrap;'
                  class='title-white-12'>                         
         <a href='contact.jsp'  class='title-white-10'
            style='vertical-align:bottom;
               height:100%;
               background-color: #000066; 
               padding:0px;
               margin:0px; 
               border:0px;'>
           Contact Us
         </a>
      </td>     
    </tr>
  </table>
</div>