スマートフォンで画面からtableがはみ出てしまう時

スマートフォンで要素が画面外にはみ出してしまうのは以下の様な状況。

  1. divやtable内の文字が折り返さない→テキストが親要素の外にはみでてしまう
  2. tableにwidth:100%;を指定しているにもかかわらず画面からはみ出る

2の場合の対処法

tableスタイルを指定している部分に下記を追加することで回避することができます。

table-layout: fixed;