＊やりたいこと
table内の指定のセル幅を固定にしたい
例のコードのように複数のテーブルがある場合、
セル中の文字列の長さに関わりなく、どのテーブルであっても、３つのセルの長さ（横幅）を固定（同一の長さ）にしたい。

＊やってみたこと

<style>
.width100{
  width:100px;
}
.width150{
  width:150px;
}
.tb-fix{
  table-layout:fixed;
}
.td-fix{
   word-wrap:break-word;
 }
</style>
最初のテーブル
<table class="tb-fix">
  <colgroup>
    <col style="width:15%;">
    <col style="width:75%;">
    <col style="width:10%;">
  </colgroup>
<tr>
  <td class="td-fix ">
  あいうえおかきくけこさしすせそあいうえおかきくけこさしすせそあいうえおかきくけこさしすせそあいうえおかきくけこさしすせそ
  </td>
  <td>
　なにか大量の文字列・・・・・
  </td>
  <td class="td-fix">
  アイウエオカキクケコサシスセソ
  </td>
</tr>
</table>
二番目のテーブル
<table class="tb-fix">
  <colgroup>
    <col style="width:15%;">
    <col style="width:75%;">
    <col style="width:10%;">
  </colgroup>
<tr>
  <td class="td-fix">
  短い文字列
  </td>
  <td>
　日本語モジレツ
  </td>
  <td class="td-fix">
  アイ 
  </td>
</tr>
</table>
三番目のテーブル
<table class="tb-fix">
  <colgroup>
    <col style="width:15%;">
    <col style="width:75%;">
    <col style="width:10%;">
  </colgroup>
<tr>
  <td class="td-fix">
  短い文字列
  </td>
  <td>
　長い英文・・・・・
  </td>
  <td class="td-fix">
  短い英文
  </td>
</tr>
</table>

ただし、真ん中のセルには、日本語のかなり長い文字列が入る前提ですが、まれに英文の場合もあります。したがって、真ん中のセル幅によって、左のセルの幅が変わってくるのが現状です。
英文であっても、日本語（全角文字）であっても、関係なく、各テーブルのセル幅を同じにしたいです。

左のセルの中の文字列が短い場合は、左のセル幅が狭くなってしまうという問題も発生しています。

どうしたら、どのテーブルも、セル幅を同一にすることができるでしょうか？