読者です 読者をやめる 読者になる 読者になる

【bootstrap】table(th, td)列幅を固定する方法メモ

bootstrap css html

修正前

<table class="table table-hover">
  <thead>
    <tr>
      <th>・・・</th>
      <th>・・・</th>
       ・・・
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>・・・</td>
      <td>・・・</td>
       ・・・
    </tr>
  </tbody>
</table>

tableタグに「style="table-layout:fixed;"」追加
thタグに「style="width:200px;"」追加

修正後

<table class="table table-hover" style="table-layout:fixed;"> <!-- ★ココにstyle追加★ -->
  <thead>
    <tr>
      <th style="width:200px;">・・・</th> <!-- ★ココにstyle追加★ -->
      <th>・・・</th>
       ・・・
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>・・・</td>
      <td>・・・</td>
       ・・・
    </tr>
  </tbody>
</table>

地味にはまった・・・
以上です