コンテナ内のテーブルセルに水平スクロールバーを追加する

Question

<div class="container">に<table class="table">があります。セルがワイドになるまで、テーブルはコンテンツのフルサイズに展開されます。

<div class="container"> 
    <table class="table"> 
     <tr> 
      <td>Caption</td> 
      <td>Some very long string that makes the contents to overflow, actually mich like this actual example in StackOverflow. 
      </td> 
     </tr> 
    </table> 
</div> 

内容は、コンテナその後、より広いいるとき、私は水平スクロールバーを持っていると思います（StackOverflowのはない実際のような...）。

どうすればよいですか？ にstyle="overflow-x: scroll"を追加しても何もしません。

Answer 1

1. .containerをmax-widthとします。
2. overflowスタイルルールを.containerに適用します。

例：は、overflowプロパティがテーブルに適用することはできません

.container { 
max-width: 400px; 
overflow-x: scroll; 
}