私は DataTables ライブラリを使用しており、autoWidthオプションを使用して DataTables に列幅を自動的に設定させ、Scroller プラグインを使用してサーバーからのヘッダーとページ データを修正しています。
この組み合わせは、テーブルに多数の列がある場合は美しく見えますが、列が数個しかない場合は、autoWidth 設定によって列が漫画のように大きくなります。
次に例を示します。
http://live.datatables.net/rizuvaza/2/edit
私が望むのは、テーブルの幅をコンテンツに必要なだけにして、それ以上広げないようにすることです。これは、コンテンツがビューポートに対して広すぎて水平方向にスクロールする必要があることを意味する場合もあれば、コンテンツがビューポートよりも狭いことを意味する場合もあります。この場合、水平方向のスペース全体を消費したくありません。
テーブルの最大幅をハードコーディングする場合に機能するいくつかのアプローチを見つけましたが、それを行うには、コードを記述して列の幅を自分で推定する必要があります。明らかに、これはさまざまな難しい測定値 (フォント サイズ、コンテンツの幅など) に依存しているため、DataTables に任せたいと思います。
常に必要な幅だけを使用してテーブルを描画するように、DataTables を構成する方法、またはラップ DOM 要素とスタイルを使用する方法はありますか?